Допускаются ли пробелы в имени шрифта для свойства font-family?

237
17 января 2018, 15:11

В документации css-свойства font-family написано, что

Названия семейства шрифтов, которые содержат пробелы, должны быть взяты в кавычки

Однако приводится пример, в котором имя семейства шрифтов с пробелами не взято в кавычки:

font-family: Gill Sans Extrabold, sans-serif;

В итоге пробелы без кавычек разрешены или нет?

Answer 1

На сайте консорциума World Wide Web (W3C) говорят, что:

To avoid mistakes in escaping, it is recommended to quote font family names that contain white space, digits, or punctuation characters other than hyphens

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

Если не поставить - в большинстве браузеров прокатит, но бывают разные случаи и разные ОС, так что я рекомендую ставить.

https://www.w3.org/TR/css-fonts-3/

p.s.: Я всегда заключаю в кавычки названия семейств шрифтов, содержащих пробелы

Answer 2

Открываем спецификацию и смотрим:

Font family names other than generic families must either be given quoted as strings, or unquoted as a sequence of one or more identifiers. This means most punctuation characters and digits at the start of each token must be escaped in unquoted font family names..........

Если коротко: если в названиях присутствуют пробелы, цифры, знаки препинания или ключевые слова (например: "inherit" и другие) то рекомендуется брать название шрифта в двойные кавычки для избежания ошибок.

READ ALSO
Свойство -webkit-font-smoothing

Свойство -webkit-font-smoothing

Скажите, пожалуйста, что означает css-свойство -webkit-font-smoothing, какие значения оно может принимать, где можно найти документацию по нему

238
rgba с сокращением для цвета (white, black и т. д.)

rgba с сокращением для цвета (white, black и т. д.)

Цвет с прозрачностью можно записать в css используя rgba

230
не работает закрытие окна на Iphone

не работает закрытие окна на Iphone

Сам код нормально выполняется на компьютере, вылетает всплывающее окно на весь экран с формой, если нажать хоть куда, кроме формы, окно закрываетсяна...

246
Range от min до max

Range от min до max

Как можно реализовать подобный range без jquery и дрбиблиотек, на нативном JS?

233