Является ли этот шрифт: сокращенный синтаксис свойства? (Мое чтение спецификации говорит да, но половина моих установленных браузеров не согласна.)

Это действительно? font: bold 10px/13px inherit;

Согласно моим прочтениям спецификации, это должно означать вес шрифта "жирный шрифт", семейство шрифтов "наследование", размер шрифта "10px" и высоту строки "13px".

Похоже, что работает правильно в Internet Explorer 8 (8.0.6001.18702).

Он правильно работает в Safari 5.0.4 (7533.20.27) в Windows.

Opera 11.01 (сборка 1190) и Firefox 3.6.16 регистрируют ошибки об этом.

Я еще не пробовал Chrome или Firefox 4.

Если это действительно должно быть достоверно, является ли эта ошибка анализа известной проблемой?

Пара дополнительных очков:

  • Валидатор W3 также сообщает, что это неверно.
  • Ни один из 'font: полужирный 10px наследовать;', 'шрифт: полужирный 10px / 13px;', или 'font: полужирный 10px;' работать в Firefox здесь тоже правильно.

Обновить

Как указал Адам Вагнер в своем ответе, моя попытка на самом деле неверна (несмотря на то, что я предложил наивное прочтение спецификации) из-за п. C.3.1 спецификации CSS2.1.

Источник

5 ответов

Решение

Я думаю, что проблема связана с "наследовать" дополнение к вашей ценности.

Согласно спецификации:

[[<'font-style'> || <'font-option'> || <'font-weight'>]? <'font-size'> [/ <'line-height'>]? <'font-family'>] | подпись | значок | меню | окно сообщения | унаследовать

Я думаю, что раздел, выделенный жирным шрифтом, который я перечислил выше, является одним из вариантов, а "заголовок", "значок", "меню", "окно сообщения" и "наследовать" - это оставшиеся параметры.

Короче, попробуйте: font: bold 10px/13px

Обновить:

Похоже, у webkit есть выдающийся отчет об ошибке по этой самой проблеме. Не уверен насчет Firefox. ( https://bugs.webkit.org/show_bug.cgi?id=20181)

Также, как кто-то упоминает в билете, спецификация 2.1 решает эту проблему:

"Сокращенные свойства берут список значений подпредприятия или значение" наследовать ". Нельзя смешивать" наследовать "с другими значениями подпредприятия, так как было бы невозможно указать подвойство, к которому применяется" наследовать ". Определения ряда сокращений свойства не применяли это правило: 'border-top', 'border-right', 'border-bottom', 'border-left', 'border', 'background', 'font', 'list-style', ' кий "и" контур "."

http://www.w3.org/TR/CSS21/changes.html

Источник

Согласно стандартам, вы не можете использовать наследование вместе с другими опциями в font Композитный стиль.

Должны быть указаны значения как font-size, так и font-family (если вы не используете формы, где они вообще не используются).

Таким образом, вы не можете использовать его, чтобы только установить вес, размер, рост, но наследовать семью.

Источник

Мое решение следующее (создать как можно меньше накладных расходов CSS при использовании большой составной декларации семейства шрифтов для вашего сайта):

.my-class {
  font: bold 1.167em/2 Helvetica;
  font-family: inherit;
}
  • Испытано (и работает) в FF, где у меня была вышеупомянутая проблема.
Источник

Очевидно, что ключевое слово inherit вызывает проблемы. Возможно, потому что CSS пытается заставить его работать, даже если вы не следовали предписанному порядку параметров (кажется, это не так, потому что другой порядок тоже не работает), и он не может решить, к какой директиве относится наследование.

Он отлично работает, если вы явно указали семейство шрифтов: font: bold 10px/13px serif;

Источник

Нет.

свойство сокращения шрифта

font: 12px normal Arial;

Сокращение шрифта - это размер, вес, стиль шрифта. Высота строки в шрифте является очень новым дополнением в CSS, и я бы не рекомендовал использовать его пока. Просто добавь

line-height: 13px;

Это не требует особых усилий, включая отдельную высоту строки, и пока она не станет кроссбраузерной, включая высоту строки в сокращенном рукописном шрифте, я бы ее вообще не использовал.

Источник
Другие вопросы по тегам