| |
к тому, что на экран будут выведены первый
заголовок уровня 1 шрифтом красного цвета размером 18 пунктов и второй заго-
ловок шрифтом черного цвета размером 1.2 пунктов:
3TO КРИТИЧЕСКИЙ заголовок уровня K/hl>
3To нормальный заголовок уровня 1
Таким образом, при определении класса каскадного списка стилей без селек-
тора, его можно будет использовать для форматирования любого элемента Web-
страницы. Если же класс будет определен с селектором, его форматирование
можно будет применить только к указанному в определении типу HTML-деск-
риптора.
Глава 4. Каскадные списки стилей
Выбор типа шрифта с помощью свойства font-family
Независимо от типа выбираемого шрифта, будь то Times New Roman, Century
Schoolbook или Matisse ITC, общий настрой Web-страницы определяется именно
шрифтом, который Web-браузер использует для вывода на экран содержимого
страницы. Поэтому не оставляйте за посетителем выбор типа шрифта (за счет
установки шрифта, используемого браузером по умолчанию), а выберите свой
шрифт, который, по вашему мнению, будет наилучшим образом соответствовать
содержимому страницы. К счастью, правила каскадных списков стилей позволя-
ют очень легко устанавливать тип шрифта, используемого Web-браузером для
отображения содержимого страниц всего Web-сайта.
ПРАКТИКУМ
Для задания используемого Web-браузером типа шрифта добавьте в описание
правила каскадного списка стилей свойство font-family. Предположим, напри-
мер, что необходимо создать Web-страницу, на которой браузер будет отображать
весь текст шрифтом Helvetica. Для описания правила списка стилей, которое
присваивает тип шрифта Helvetica дескриптору <р>, используется селектор абза-
ца (р) и свойство font-family, как показано в следующем коде:
Bbi6op семейства шрифтов (то есть начертания)
В приведенном примере правило каскадного списка стилей для селектора аб-
заца (р) заставляет браузер выводить на экран весть текст, который находится
после дескриптора <р>, шрифтом Helvetica. Свойство font-family, значение ко-
торого устанавливается в фигурных скобках ({}), является частью объявления
стиля каскадного списка стилей и указывает, какой тип шрифта должен исполь-
зоваться.
Вместо указания одного типа шрифта можно создавать правила с нескольки-
ми типами шрифтов. Указывая несколько шрифтов, вы даете Web-браузеру воз-
можность выбора, если основной указанный в правиле тип шрифта в системе по-
сетителя не установлен. Следует иметь в виду, что если в системе посетителя не
установлен шрифт, указанный в правиле каскадного списка стилей, Web-браузер
будет использовать шрифт по умолчанию. Для снижения вероятности выбора
шрифта, не установленного на компьютере посетителя (в результате чего содер-
жимое Web-страницы будет выводиться шрифтом по умолчанию), создайте пра-
вило списка стилей, с выбором альтернативного второго (например, Times New
Roman) или даже третьего (возможно, Courier) типа шрифта. (Теоретический
предел для количества типов шрифтов, указываемых в правилах каскадных спис-
ков стилей, не установлен.)
Глава 4. Каскадные списки стилей . 189
Для создания объявления каскадного списка стилей с альтернативными типа-
ми шрифтов, из списка которых браузер будет иметь возможность выбирать, не-
обходимо в правиле списка стилей перечислить все требуемые шрифты, как в
приведенном ниже примере:
npHMep изменения начертания шрифта</-ЫЪ
1е>
<style type="text/ess">
р {font-family:Helvetica;"times new roman" ,courier}
—->
</style>
</head>
<body>
<п1>Стандартый заголовок уровня K/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-браузер воспользуется шрифтом, установленным в нем по умолчанию.
Задание размера текста с помощью свойства font-size
П</pre>
</td>
<td align="left" class="row2s" width="5%"> </td>
</tr>
<tr><td class="row3" align="left" width="5%"><a href="/comp/.view-Samouchitelj.po.kreativnomu.webdizajnu.txt.101.html"><img border="0" src="/tpl/l.gif" alt="<<-"></a></td><td class="row3s" align="center" width="20%" valign="middle"><a href="/comp/.view-Samouchitelj.po.kreativnomu.webdizajnu.txt.full.html">[Весь Текст]</a></td><td class="row3s" align="center" width="70%" valign="middle"><br><form action="" method="get">Страница: <input type="text" size="4" name="pg" value="103"> из 389 <input type="submit" value="Открыть"></form></td><td class="row3s" align="center" width="20%" valign="middle"> </td><td class="row3" align="right" width="5%"><a href="/comp/.view-Samouchitelj.po.kreativnomu.webdizajnu.txt.103.html"><img border="0" src="/tpl/r.gif" alt="<<-"></a></td></tr></table>
</body>
</html>
|
