Синтаксис этого свойства основан на традиционной типографской сокращенной записи для установки нескольких свойств, связанных со шрифтами.
Как сказал Дэвид М в комментариях, это отражает традицию набора текста, когда размеры шрифта указываются как « x pt on y pt» для обозначения размера глифа на высоте строки.
Но пример в вашем вопросе на самом деле неверен и будет проигнорирован браузером: вы можете объединить эти два свойства только в fontсокращенной записи, и вы должны указать по крайней мере и размер шрифта, и семейство. font: 100%/120%;Поэтому простого письма недостаточно; вы можете добавить общее имя семейства, чтобы сделать его действительным, например:
Он отражает старый синтаксис набора текста, где у вас должен быть установлен шрифт, например, «10pt на 12pt» или «10pt / 12pt».
Дэвид М.
1
Я на самом деле довольно часто этим пользуюсь. Дизайнер, с которым я работаю, всегда относится к размеру, например, «14 на 22». Однажды я вставил его случайно и был удивлен / доволен, когда он сработал.
Дилан Лукс
1
Быстрый совет: этот формат также не требует указания семейства шрифтов? Мои браузеры игнорируют это свойство: font: 12px / 16px; но принимая это: font: 12px / 16px sans-serif; Это поведение также задокументировано здесь
kumarharsh
@Harsh Да, для fontсокращенного свойства минимально требуется семейство (вместе с размером), как вы можете видеть в официальном определении .
Конрад Рудольф
Спасибо за разъяснения. Возможно, вы можете обновить ответ (или вопрос), поскольку это немного вводит в заблуждение, поскольку случайный читатель может предположить, что будет работать только объявление SIZE / LINE_HEIGHT.
кумархарш
15
У Конрада есть это, но есть много таких сокращенных свойств CSS, которые вы можете использовать для сокращения ваших таблиц стилей. Некоторые из них выглядят немного загадочно, если вы их не знаете.
Однако большинство сокращений обращаются к связанным свойствам стиля (например, border-*). Дэвид дал хорошее объяснение в комментариях к моему ответу. Что касается загадочных сокращений: конечно, правда, но чертовски полезно и довольно легко выучить.
font-sizeне принимает косую черту. Правильное свойство естьfont.Ответы:
Фактически это устанавливает два свойства и эквивалентно:
Процитируем официальную документацию :
Как сказал Дэвид М в комментариях, это отражает традицию набора текста, когда размеры шрифта указываются как « x pt on y pt» для обозначения размера глифа на высоте строки.
Но пример в вашем вопросе на самом деле неверен и будет проигнорирован браузером: вы можете объединить эти два свойства только в
fontсокращенной записи, и вы должны указать по крайней мере и размер шрифта, и семейство.font: 100%/120%;Поэтому простого письма недостаточно; вы можете добавить общее имя семейства, чтобы сделать его действительным, например:источник
fontсокращенного свойства минимально требуется семейство (вместе с размером), как вы можете видеть в официальном определении .У Конрада есть это, но есть много таких сокращенных свойств CSS, которые вы можете использовать для сокращения ваших таблиц стилей. Некоторые из них выглядят немного загадочно, если вы их не знаете.
источник
border-*). Дэвид дал хорошее объяснение в комментариях к моему ответу. Что касается загадочных сокращений: конечно, правда, но чертовски полезно и довольно легко выучить.