p {
font-family: "Trebuchet MS", sans-serif;
}
В примере, изображенном на рис. 8.4, показано окно браузера в системе, где установлен шрифт Trebuchet MS.
Рис. 8.4. Установка шрифта
Внимание!
Необходимо помнить, что если название шрифта содержит пробелы, то его необходимо заключить в кавычки.
Вы можете попробовать работать и с другими шрифтами и группами. Ниже приведены несколько групп и их основные шрифты, которые доступны для большинства пользователей с разными браузерами и операционными системами:
• serif – Times New Roman, Garamond, Georgia;
• sans-serif – Trebuchet, Arial, Verdana;
• monospace – Courier, Courier New, Andale Mono.
Старайтесь не использовать экзотических шрифтов, и тогда вы сможете быть уверенными, что страница у клиента будет отображена так, как вы задумали.
Стиль шрифта
Стиль шрифта задается свойством font-style, которое может принимать одно из трех значений: normal, oblique или italic. Эти значения имеют следующий смысл.
• normal – определяет шрифт, который классифицируется как Normal. При отображении на экране он выглядит как обычный текст.
• oblique – задает шрифт, который классифицируется как Oblique. К нему, как правило, относятся шрифты со словами Oblique, Slanted или Incline в названиях. Такой текст может в действительности генерироваться электронным наклоном нормального шрифта.
• italic – определяет шрифт, который классифицируется как Italic и, если это недоступно, шрифт, помеченный как Oblique. К Italic, как правило, относятся шрифты со словами Italic, Cursive или Kursiv в названиях.
Для примера изменим стиль элементов P класса namek в нашем примере на курсив:
p.namek {
font-style: italic;
}
На рис. 8.5. видно что текст Намек: добивается успеха только тот, кто старается теперь записан курсивом.
Рис. 8.5. Стиль шрифта
Вы также можете сделать весь текст на странице курсивом, используя такой код:
body {
font-style: oblique;
}
Вид шрифта
Свойство font-variant может принимать одно из двух значений: normal или small-caps. Если задано значение small-caps, то текст будет выведен шрифтом из малых прописных букв. Если задано значение normal, то текст отображается, как обычно.
Лучше всего это понятно на примере. Применим свойство small-caps для наших заголовков второго уровня:
h2 {
font-variant: small-caps;
}
Результат просмотра страницы браузером Internet Explorer 6 показан на рис. 8.6.
Рис. 8.6. Вариант шрифта
Примечание
Следует отметить, что если font-variant имеет значение small-caps, а шрифт недоступен, то браузер будет симулировать такой шрифт, например, замещением букв нижнего регистра обычного шрифта пересчитанными символами верхнего регистра. В крайнем случае весь текст будет воспроизведен буквами верхнего регистра.
Ширина шрифта
Свойство font-weight определяет ширину шрифта. Значение может быть задано числом от 100 до 900 (в сотнях), где каждый номер обозначает шрифт, который темнее своего предшественника. В других случаях значение может быть следующим.
• normal – текст будет отображен обычным шрифтом. В числовом выражении соответствует значению 4 0 0.
• bold – текст будет отображен более широким шрифтом, чем обычно. Численно оно равно значению 7 0 0.