Font-size-adjust - CSS-хитрости

Anonim

Это свойство дает разработчикам возможность установить font-sizeэлемент в зависимости от размера его строчных букв, а не прописных букв.

.element ( font-size: 22px; font-size-adjust: .5; )

В этом случае строчные буквы шрифта будут иметь высоту 11 пикселей, так как 22 x 0,5 = 11.

При загрузке шрифтов, вероятно, будет другое соотношение сторон между строчными буквами резервного шрифта и вновь загруженным шрифтом, поэтому font-size-adjustполезно контролировать количество перекомпоновки, когда мы объявляем новый font-familyи видим Flash of Unstyled Text (FOUT).

В приведенной ниже демонстрации можно включать и выключать это свойство, чтобы показать, как веб-шрифт, такой как Chaparral, отличается от высоты по оси x и выравнивания символов в Times, резервном шрифте. Но будьте осторожны, на данный момент это свойство поддерживается только небольшим количеством браузеров.

Это может иметь драматические последствия при установке на большие части основного текста и существенно улучшить мерцание, возникающее при переключении между резервным и вновь загруженным шрифтом:

Дополнительная информация

  • MDN
  • W3C

Поддержка браузера

Эти данные о поддержке браузером взяты из Caniuse, где есть более подробная информация. Число означает, что браузер поддерживает эту функцию в этой версии и выше.

Рабочий стол

Хром Fire Fox IE Край Сафари
Нет 3 Нет Нет Нет

Мобильный / планшет

Android Chrome Android Firefox Android iOS Safari
Нет Нет Нет Нет