Приветствую Вас, Гость

Выбор типа шрифта с помощью свойства font-family

Независимо от типа выбираемого шрифта, будь то Times New Roman, Century Schoolbook или Matisse ITC, общий настрой Web-страницы определяется именно шрифтом, который Web-браузер использует для вывода на экран содержимого страницы. Поэтому не оставляйте за посетителем выбор типа шрифта (за счет установки шрифта, используемого браузером по умолчанию), а выберите свой шрифт, который, по вашему мнению, будет наилучшим образом соответствовать содержимому страницы. К счастью, правила каскадных списков стилей позволяют очень легко устанавливать тип шрифта, используемого Web-браузером для отображения содержимого страниц всего Web-сайта.

ПРАКТИКУМ

Для задания используемого Web-браузером типа шрифта добавьте в описание правила каскадного списка стилей свойство font-family. Предположим, например, что необходимо создать Web-страницу, на которой браузер будет отображать весь текст шрифтом Helvetica. Для описания правила списка стилей, которое присваивает тип шрифта Helvetica дескриптору <p>, используется селектор абзаца (р) и свойство font-family, как показано в следующем коде:

<head>

<title>Выбор семейства шрифтов (то есть начертания)</title>

<style type="text/сss">

р {font-family:helvetica}

</style>

</head>

В приведенном примере правило каскадного списка стилей для селектора абзаца (p) заставляет браузер выводить на экран весть текст, который находится после дескриптора <p>, шрифтом Helvetica. Свойство font-family, значение которого устанавливается в фигурных скобках ({}), является частью объявления стиля каскадного списка стилей и указывает, какой тип шрифта должен использоваться.

Вместо указания одного типа шрифта можно создавать правила с несколькими типами шрифтов. Указывая несколько шрифтов, вы даете Web-браузеру возможность выбора, если основной указанный в правиле тип шрифта в системе посетителя не установлен. Следует иметь в виду, что если в системе посетителя не установлен шрифт, указанный в правиле каскадного списка стилей, Web-браузер будет использовать шрифт по умолчанию. Для снижения вероятности выбора шрифта, не установленного на компьютере посетителя (в результате чего содержимое Web-страницы будет выводиться шрифтом по умолчанию), создайте правило списка стилей, с выбором альтернативного второго (например, Times New Roman) или даже третьего (возможно, Courier) типа шрифта. (Теоретический предел для количества типов шрифтов, указываемых в правилах каскадных списков стилей, не установлен.)

Для создания объявления каскадного списка стилей с альтернативными типа- ми шрифтов, из списка которых браузер будет иметь возможность выбирать, не- обходимо в правиле списка стилей перечислить все требуемые шрифты, как в приведенном ниже примере:

<html>

<head>

<title>Пример изменения начертания шрифта</title>

<style type="text/css">

<!--

р {font-family:Helvetica;"times new roman" ,courier}

-->

</style>

</head>

<body>

<h1>Стандартный заголовок уровня 1</hl>

<p>Web-браузер выводит текст, заключенный между дескрипторами абзаца, шрифтом Helvetica. Если этот шрифт по ряду причин не доступен, CSS-правило заставляет Web-браузер искать шрифт Times New Roman, а затем Courier.</p>

<р>Если все три упомянутых шрифта оказываются недоступными, Web-браузер игнорирует данное CSS-правило и использует шрифт, который установлен в браузере по умолчанию.</р>

</body>

</html>

Здесь свойство font-family указывает, что браузер должен выводить на экран текст, находящийся после дескриптора <р> шрифтом Helvetica. Если шрифт Helvetica на компьютере посетителя не установлен, будет использоваться шрифт Times New Roman. Если же и Times New Roman отсутствует, браузер попытается вывести содержимое Web-страницы шрифтом Courier. В случае если в системе посетителя не окажется ни одного перечисленного в свойстве font-family шрифта, Web-браузер воспользуется шрифтом, установленным в нем по умолчанию.