CSS Безопасные веб-комбинации шрифтов
Часто используемые сочетания шрифтов
Свойство font-family должно содержать несколько имен шрифтов в качестве "резервной" системы, чтобы обеспечить максимальную совместимость между браузерами/операционными системами. Если обозреватель не поддерживает первый шрифт, он пытается следующий шрифт.
Начните с нужного шрифта и заканчивайте родовым семейством, чтобы позволить обозревателю выбрать аналогичный шрифт в родовом семействе, если другие шрифты недоступны:
Пример
p {
font-family: "Times New Roman", Times, serif;
}
Ниже приведены некоторые часто используемые сочетания шрифтов, упорядоченные по родовому семейству.
Шрифты с засечками
| font-family | Пример текста |
|---|---|
| Georgia, serif | This is a headingThis is a paragraph |
| "Palatino Linotype", "Book Antiqua", Palatino, serif | This is a headingThis is a paragraph |
| "Times New Roman", Times, serif | This is a headingThis is a paragraph |
Шрифты без засечек
| font-family | Пример текста |
|---|---|
| Arial, Helvetica, sans-serif | This is a headingThis is a paragraph |
| "Arial Black", Gadget, sans-serif | This is a headingThis is a paragraph |
| "Comic Sans MS", cursive, sans-serif | This is a headingThis is a paragraph |
| Impact, Charcoal, sans-serif | This is a headingThis is a paragraph |
| "Lucida Sans Unicode", "Lucida Grande", sans-serif | This is a headingThis is a paragraph |
| Tahoma, Geneva, sans-serif | This is a headingThis is a paragraph |
| "Trebuchet MS", Helvetica, sans-serif | This is a headingThis is a paragraph |
| Verdana, Geneva, sans-serif | This is a headingThis is a paragraph |
Monospace Fonts
| font-family | Пример текста |
|---|---|
| "Courier New", Courier, monospace | This is a headingThis is a paragraph |
| "Lucida Console", Monaco, monospace | This is a headingThis is a paragraph |
Совет: Кроме того, проверьте все доступные шрифты Google и их использование.