CSS-семейство шрифтов откат для иконки?

Моя IDE проверяет мои CSS-файлы и жалуется, если я font-family Правило, которое не имеет общего запасного варианта. В общем, я должен согласиться с моей IDE, и я с радостью добавлю обратный вызов шрифта.

Пример:

.selector {
  font-family: Arial;  /* IDE complains. */
  font-family: Arial, sans-serif;  /* IDE is happy. */
}

Тем не менее, иногда семейство шрифтов является значком шрифта (я думаю, что fontawesome - один из них), и запасной вариант не имеет смысла. Или это?

.my-icon {
  font-family: 'my-icon-font';  /* IDE complains. */
  font-family: 'my-icon-font', serif;  /* IDE is happy, but it does not make sense. */
}

Вопрос

Может ли быть какой-нибудь разумный запасной вариант, который имеет смысл добавить к правилу семейства шрифтов с помощью значка-шрифта?

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

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

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

Или что, если я являюсь автором инструмента проверки кода, или в процессе определения соглашений о кодировании, которые будут использоваться в проекте? Тогда я определенно хочу знать, каким будет "правильный" или самый умный способ сделать это:)

Источник

3 ответа

Как обсуждалось в комментариях, это ложное предупреждение.

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

В соответствующей спецификации (CSS Fonts Module Level 3) перечислены только следующие общие семейства :

  • с засечками
  • без засечек
  • скоропись
  • фантазия
  • моноширинный

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

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

Примечание: резервные шрифты действительно необходимы только в том случае, если вы хотите использовать шрифт, установленный на компьютере пользователя, например стандартные шрифты Windows, такие как Arial. В этом случае вам нужен запасной вариант, потому что вы не можете быть уверены, что пользователь установил.

Если вы используете веб-шрифт, который может загрузить браузер, никогда не должно быть необходимости в резервном шрифте. Это все еще неплохо включить на случай, если загрузка шрифта не удалась, но ИМХО не так важно.

Источник

Можно добавить "фантазию":

.my-icon {
  font-family: 'my-icon-font', fantasy;
}
Источник

@mtonev

emoji — шрифты, специально разработанные для отображения emoji.https://developer.mozilla.org/en-US/docs/Web/CSS/font-family

«Другой вариант» тоже не подходит. И какими бы похожими ни казались смайлики и значки: смайлики имеют представление Unicode, а значки — это просто набор изображений.

узнать больше: https://www.sitepoint.com/icon-fonts-vs-svg-debate/

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