Основы работы с XHTML и CSS
Представление заголовков таблицами стилей
Вспомните, что теги заголовков <hn> окаймляют строки текста для вывода одним из шести стилей заголовков. Число n в теге изменяется от 1 (самый крупный) до 6 (наименьший). Заголовки выводятся полужирными символами используемого по умолчанию типа шрифта. Конечно, для изменения настроек тега заголовка можно применить таблицу стилей. Например, объявление стиля
<style type="text/css"> h2 {font-family:arial; font-style:italic} </style>
Листинг 4.12. Оформление тега заголовка в таблице стилей (html, txt)
выводит заголовок размером 2, наклонным типом шрифта Arial, переопределяя обычный вывод заголовка шрифтом Times New Roman. Другие стили могут использоваться в теге для вывода заголовка с дополнительными характеристиками оформления.
Таким же образом, как физические и логические теги шрифтов можно реализовать с помощью таблиц стилей, можно создавать заголовки с помощью таблиц стилей вместо использования специальных тегов <hn>. Следующая таблица стилей объявляет классы стилей, идентичные шести типам заголовков. Это кодирование выводится в браузере, как показано на рисунке 4.8.
<style type="text/css"> .head1 {font:bold 24pt} .head2 {font:bold 18pt} .head3 {font:bold 13.5pt} .head4 {font:bold 11pt} .head5 {font:bold 10pt} .head6 {font:bold 7.5pt} </style>
<p class="head1">Заголовок уровня 1</p> <p class="head2">Заголовок уровня 2</p> <p class="head3">Заголовок уровня 3</p> <p class="head4">Заголовок уровня 4</p> <p class="head5">Заголовок уровня 5</p> <p class="head6">Заголовок уровня 6</p>
Листинг 4.13. Теги оформления заголовков стилями (html, txt)
Рис. 4.8. Вывод в браузере заголовков, созданных с помощью объявлений стилей
Таким образом, существует несколько возможных вариантов оформления заголовков. Можно использовать теги <hn> с настройками по умолчанию, использовать эти теги с измененным оформлением или вообще отказаться от тегов и создать свои собственные классы заголовков. Ни один из вариантов не является лучшим решением во всех случаях.
