Свойства шрифта в таблицах CSS

В этой главе мы рассмотрим свойства шрифтов в каскадных таблицах стилей (CSS) и их значения.

Шрифтам в проектировании сайта необходимо уделять особое внимание. Т.к. пользователи используют различные браузеры - некоторые шрифты могут не отображаться вообще. Для кириллических шрифтов наиболее пригодны всего три семейства шрифтов - serif (обычно Times или другой шрифт с засечками), sans-serif - (Arial, Helvetica или другой шрифт без засечек) и monospace - (Courier). Управлять свойствами шрифта в таблицах стилей можно применяя следующие атрибуты:

font-family: - указывает имя шрифта или шрифтового семейства, используемого в элементе страницы.

В качестве значения этого атрибута задается либо непосредственно имя нужного шрифта, либо одно из пяти предопределенных значений - serif, san-serif, cursive, fantasy, monospace, задающих имя шрифтового семейства. Можно задавать одновременно несколько шрифтов, разделив их имена запятыми; в этом случае Web-обозреватель сможет выбрать из них тот, который установлен на компьютере клиента. Если имя шрифта содержит пробелы, его следует взять в кавычки.

Пример:

font-family:" Times New Roman",sans-serif; 

font-weight - задает "жирность" шрифта, используемого в элементе страницы.

"Жирность" может быть задана тремя способами. Во-первых, предопределенными значениями normal и bold, задающими обычное и жирное начертание соответственно. Во-вторых, относительными значениями bolder и lighter, делающими шрифт элемента страницы жирнее и светлее шрифта родителя. И, в-третьих, одним из девяти значений от 100 до 900; здесь нормальному начертанию соответствует значение 400, а жирному - 700.
font-weight: normal; - обычный;
font-weight: lighter; - светлее;
font-weight: bold; - жирный;
font-weight: bolder; - жирнее;
font-weight: от 100 до 900 - любое значение, кратное 100 (200,700).

Пример:

font-weight: normal; 

font-size - задает размер шрифта, используемого в элементе страницы.

Возможно задание либо абсолютного размера шрифта в одной из поддерживаемых CSS единиц измерения, либо как процент от размера шрифта родителя.
font-size: 200% - относительная величина (проценты)
font-size: 150px - размер в пикселях
font-size: 300pt - размер в пунктах
Также доступны девять определенных значений.
font-size: {xx-small, x-small, small, medium, large, x-large, xx-large} - задают один из семи размеров шрифтов, поддерживаемых HTML
font-size: {smaller, larger} - задают размер шрифта, который на размер либо больше, либо меньше родительского шрифта соответственно

Пример:

font-size: 12pt; 

font-style - задает начертание шрифта.

font-style: normal; - задает обычный вид шрифта (используется по умолчанию);
font-style: italic - курсивное начертание;
font-style: obligue - наклонное начертание (легкий наклон нормального шрифта)

Пример:

font-style: italic; 

font-variant - задает вид малых букв шрифта, используемого в элементе страницы.

font-variant: normal; - задает обычный вид малых букв шрифта (используется по умолчанию);
font-variant: small-caps; - делает их такими же, как большие буквы, только меньшего размера (капитель).

Пример:

font-variant: normal; 

font - задает параметры шрифта элемента страницы.

Заменяет атрибуты font-family, font-size, font-style, font-variant и font-weight. Значения этих атрибутов могут располагаться в любом порядке.
Значение по умолчанию - "Times New Roman", medium, normal, normal, normal

Свойства шрифта в таблицах CSS

Реклама