<generic-family>

Тип данных <generic-family> CSS данных представляет собой ключевые значения для наборов шрифтов по умолчанию, используемые в сокращенной записи font и полной записи font-family свойств. <generic-family> представляет один или несколько локально установленных шрифтов, относящихся к этой категории шрифтов.

Синтаксис

<generic-family> = serif | sans-serif | monospace | cursive | fantasy | system-ui |
   ui-serif | ui-sans-serif | ui-monospace | ui-rounded | emoji | math | fangsong

Значения

Перечисленный тип <generic-family> перечисления задаётся одним из указанных ниже значений:

serif: Кегль — это тонкая линия или штрих, прикреплённый к концу более толстого штриха буквы. В шрифтах с засечками глифы имеют завершающие штрихи, заострённые или сужающиеся концы. Примеры включают Lucida Bright, Lucida Fax, Palatino, Palatino Linotype, Palladio и URW Palladio.
sans-serif: Шрифт без засечек; глифы имеют простые окончания штрихов без декоративных элементов. Примеры шрифтов без засечек включают Open Sans, Fira Sans, Lucida Sans, Lucida Sans Unicode, Trebuchet MS, Liberation Sans и Nimbus Sans L.
monospace: Все глифы имеют одинаковую фиксированную ширину. Примеры моноширинных шрифтов включают Fira Mono, DejaVu Sans Mono, Menlo, Consolas, Liberation Mono, Monaco и Lucida Console.
cursive: Глифы в курсивных шрифтах обычно имеют соединяющие штрихи или другие курсивные особенности, выходящие за рамки наклонных шрифтов. Глифы частично или полностью соединены, и результат выглядит более похожим на рукописный шрифт или письмо кистью, чем печатный текст. Примеры курсивных шрифтов включают Brush Script MT, Brush Script Std, Lucida Calligraphy, Lucida Handwriting и Apple Chancery.
fantasy: Шрифты «фантазийного» стиля — это в основном декоративные шрифты, содержащие игривые изображения символов. Примеры фантазийных шрифтов включают Papyrus, Herculanum, Party LET, Curlz MT и Harrington.
system-ui: Глифы берутся из шрифта по умолчанию пользовательского интерфейса на данной платформе. Поскольку типографические традиции сильно различаются по всему миру, этот набор шрифтов по умолчанию предоставляется для шрифтов, которые не соответствуют другим.
ui-serif: Шрифт по умолчанию пользовательского интерфейса с засечками. См. определение serif выше.
ui-sans-serif: Шрифт по умолчанию пользовательского интерфейса без засечек. См. определение sans-serif выше.
ui-monospace: Моноширинный шрифт по умолчанию пользовательского интерфейса. См. определение monospace выше.
ui-rounded: Шрифт по умолчанию пользовательского интерфейса с закруглёнными элементами.
math: Шрифты для отображения математических выражений, например, верхних и нижних индексов, скобок, перекрывающих несколько строк, вложенных выражений и глифов с двойным вычерчиванием с различными значениями.
emoji: Шрифты, специально разработанные для отображения эмодзи.
fangsong: Конкретный стиль китайских символов, находящихся между стилем Song с засечками и курсивным стилем Kai. Этот стиль часто используется для официальных документов.

Примеры

Этот пример демонстрирует несколько значений перечисления <generic-family> для свойства font-family.

HTML

<ul>
  <li class="serif">serif</li>
  <li class="sans-serif">sans-serif</li>
  <li class="monospace">monospace</li>
  <li class="cursive">cursive</li>
  <li class="fantasy">fantasy</li>
  <li class="system-ui">system-ui</li>
</ul>

CSS

ul {
  font-size: 1.5rem;
  line-height: 2;
}
.serif {
  font-family: serif;
}
.sans-serif {
  font-family: sans-serif;
}
.monospace {
  font-family: monospace;
}
.cursive {
  font-family: cursive;
}
.fantasy {
  font-family: fantasy;
}
.system-ui {
  font-family: system-ui;
}

Результат

Спецификации

Спецификация
CSS Fonts Module Level 4 # generic-font-families

См. также

Свойства, использующие этот тип данных: font-family и font
Модуль CSS шрифтов

© 2005–2024 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/CSS/generic-family