Руководство по CSS

Правила CSS (@RULES)

Полный список свойств CSS

Аудиторское руководство по CSS Допустимые имена цветов CSS

Безопасные шрифты для веб-страниц CSS

Безопасные шрифты для веба являются极为 распространенными шрифтами, которые наиболее вероятно будут встречаться на различных операционных системах, таких как Windows, Mac, Linux и т.д.

Почему выбирают безопасные шрифты для веба

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

Чтобы обеспечить точное представление текста в большинстве браузеров или операционных систем, вам необходимо очень тщательно определять шрифты.font-familyАтрибут CSS может容纳 несколько имен шрифтов в качестве резервных систем. Сначала указывается предпочтительный шрифт, а затем, если предпочтительный шрифт недоступен, используется резервный шрифт.

Всегда используйте универсальные семейства шрифтов в качестве значения属性 font-family, среди которых есть пять: serif, sans-serif, monospace, cursive и fantasy. Если шрифт, который вы определили, недоступен, универсальное семейство шрифтов позволяет браузеру выбрать похожий шрифт.

В таблице приведены комбинации шрифтов, которые безопасно использовать.

Семейство шрифтов	Нормальный	Жирный
Arial, Helvetica, sans-serif	Это обычный текст.	Это полужирный текст.
"Times New Roman", Times, serif	Это обычный текст.	Это полужирный текст.
"Courier New", Courier, моноширинный	Это обычный текст.	Это полужирный текст.

Ниже приведен пример того, как правильно устанавливать атрибуты с помощью font-family.

Пример

.sans-serif-font {
　　　font-family: Arial, Helvetica, sans-serif;
}
.serif-font {
　　　font-family: "Times New Roman", Times, serif;
}
.monospace-font {
　　　font-family: "Courier New", Courier, моноширинный;
}

Тестировать, смотреть‹/›

Обычные шрифтовые комбинации

В таблице ниже приведены некоторые常用的 шрифтовые комбинации, организованные по общим сериям.

Серифные шрифты

Семейство шрифтов	Нормальный	Жирный
Georgia, serif	Это обычный текст.	Это полужирный текст.
"Times New Roman", Times, serif	Это обычный текст.	Это полужирный текст.
"Palatino Linotype", Palatino, “Book Antiqua”, serif	Это обычный текст.	Это полужирный текст.

Sans-Serif шрифты

Семейство шрифтов	Нормальный	Жирный
Arial, Helvetica, sans-serif	Это обычный текст.	Это полужирный текст.
"Arial Black", Gadget, sans-serif	Это обычный текст.	Это полужирный текст.
Impact, Charcoal, sans-serif	Это обычный текст.	Это полужирный текст.
Tahoma, Geneva, sans-serif	Это обычный текст.	Это полужирный текст.
"Trebuchet MS", Helvetica, sans-serif	Это обычный текст.	Это полужирный текст.
Verdana, Geneva, sans-serif	Это обычный текст.	Это полужирный текст.

Моноширинный шрифт

Семейство шрифтов	Нормальный	Жирный
Courier, моноширинный	Это обычный текст.	Это полужирный текст.
"Courier New", Courier, моноширинный	Это обычный текст.	Это полужирный текст.
"Lucida Console", Monaco, моноширинный	Это обычный текст.	Это полужирный текст.

Курсивный шрифт

Семейство шрифтов	Нормальный	Жирный
"Comic Sans MS", курсив	Это обычный текст.	Это полужирный текст.
"Courier New", Courier, моноширинный	Это обычный текст.	Это полужирный текст.
"Lucida Console", Monaco, моноширинный	Это обычный текст.	Это полужирный текст.

Шрифты Fantasy

Нет шрифтов Fantasy с хорошей совместимостью во всех браузерах и операционных системах.

Внимание:Шрифты (Verdana, Georgia, “Comic Sans MS”, “Trebuchet MS”, “Arial Black”, Impact) работают на Windows и MacOS, но не работают на Unix + X.

Аудиторское руководство по CSS Допустимые имена цветов CSS