HTML / 8. Каскадные таблицы стилей

Применение стилей в документах

Есть несколько вопросов, которые вы должны задать себе перед тем, как использовать таблицы стилей в документах или их собраниях в процессе работы над ними и по ее окончании. Первый, наиглавнейший вопрос состоит в том, употреблять ли их вообще. Честно говоря, немногие эффекты могут быть достигнуты только с применением таблиц стилей, большая их часть осуществляется, хотя и с большим трудом и с гораздо меньшей последовательностью, при использовании тегов физической и логической разметки, подобных <i> и <em>, и различных атрибутов тегов, таких как color и background.

Использовать ли таблицы стилей?
Мы считаем, что стандарт CSS2 – победитель. Не только в связи со стандартами, основанными на JavaScript, но более всего из-за предоставляемых им удобств и эффективности при работе со всевозможными раз-меченными документами, включая HTML-, XHTML-разработки и любые другие, созданные в согласии со стандартом XML. Большинство используемых в настоящее время броузеров поддерживают стили CSS1 и многие из стилей CSS2. Выигрыш очевиден. Так почему же не применять таблицы стилей?

Хотя мы настоятельно рекомендуем вам изучить и использовать в документах таблицы стилей CSS2, мы все же понимаем, что их создание требует затрат времени и сил, которые окупятся только через продолжительный промежуток времени. Разработка таблиц стилей для двухтрехстраничных документов – это не лучшим образом потраченное время, особенно если вы не будете применять их для других документов. Но, вообще говоря, мы полагаем, что проблема не в том, использовать таблицы стилей или не использовать, а в том, когда их использовать.

Какой тип таблиц стилей применять и когда
Раз уж вы решили применять каскадные таблицы стилей (на горе себе или на радость), следующим вопросом будет, какого типа стили – встроенные, определенные таблицами на уровне документа или внешние – следует употреблять и когда? У каждого типа есть свои достоинства и недостатки. Каждый из них лучше всего подходит в определенных обстоятельствах.

Достоинства и недостатки внешних таблиц
Когда таблицы стилей должны обеспечить стилистическое единство документов, внешние таблицы позволяют наилучшим и самым легким способом управлять стилями во всем собрании документов. Просто внесите нужное стилевое правило в таблицу стилей и примените их к нужным документам. И поскольку одна таблица стилей действует на
все документы, преобразование всего собрания к новому стилю окажется не труднее, чем изменение одного стилевого правила в соответствующей внешней таблице.

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

• Цвет фона
• Фоновое изображение
• Размеры и начертания шрифтов
• Поля
• Выравнивание текста

Еще одно преимущество употребления таблиц стилей состоит в том, что другие авторы сетевых документов, которые захотят скопироватьваш стиль, могут с легкостью получить такую таблицу и сделать свои страницы похожими на ваши. Подражание – это самая искренняя форма лести, так что не стоит огорчаться, что кто-то решил сымитировать внешний облик и характер ваших страниц. Более того, вы не сможете защитить свои таблицы от подключения, так что расслабьтесь.

Как и обычные HTML-документы, таблицы стилей нельзя зашифровать или как-то еще спрятать, чтобы окружающие не могли их видеть и пользоваться ими. Самая большая проблема с внешними таблицами стилей заключается в том, что они увеличивают время, необходимое для получения доступа к странице. Мало того, что броузер должен ее загрузить, он должен также загрузить таблицу перед тем, как страницу удастся представить на обозрение. Хотя большинство таблиц стилей относительно невелики, их присутствие можно с определенностью ощутить, когда соединение с сетью медленное.
Без соответствующей дисциплины внешние таблицы быстро становятся большими и громоздкими. При их создании помните, что включать в таблицы следует только стили, общие для всех обращающихся к ней документов. Если ряд стилевых правил употребляется только одним или двумя документами, лучше выделить их в отдельную таблицу или вставить в документ, используя стили на его уровне. В противном случае вы можете обнаружить, что тратите непомерно много усилий на нейтрализацию действия внешних стилей во множестве отдельных документов.

Достоинства и недостатки определения стилей на уровне документа
Определение стиля на уровне документа полезней всего при подгонке документа под особые требования. Такие определения позволяют переиначить одно или несколько правил, определенных во внешних таблицах, чтобы создать слегка отличающийся документ.

Иногда хочется попробовать новые стилевые правила на уровне документа, прежде чем применять их в таблицах стилей. Добавляя и изменяя правила на уровне документа, вы избегаете риска поместить во внешнюю таблицу плохо или совсем не работающий стиль, который испортит внешний вид всех документов, применяющих эту таблицу. Самая большая проблема таблиц на уровне документа состоит в том, что можно поддаться соблазну использовать только их, вместо того чтобы создать правильную внешнюю таблицу для управления всей коллекцией. Это так легко – добавлять правила в новый документ при его создании – вырезал и вставил. К несчастью, управление собранием
документов со стилями, определенными на уровне документа, – это скучное и чреватое ошибками занятие. Внесение даже простого изменения может потребовать нескольких часов редактирования (с возможными ошибками).В качестве рабочего подхода можно принять, что любое правило, которое используется тремя или большим числом документов, следует вынести во внешнюю таблицу стилей и применить к ним с помощью тега <link> или команды @import. Приверженность этому правилу при создании семейств документов окупит себя со временем, когда придет время менять стили.

Достоинства и недостатки встроенных стилей
И наконец, расположенные в самом низу каскада встроенные в теги стили могут переопределить более общие стили. Возьмите в привычку употреблять встроенные стили редко и только для этой цели. Встроенные стили не подлежат повторному использованию, что приводит к более трудному контролю над ними. Кроме того, нужные изменения разбросаны по всему документу, а это делает обнаружение и правку встроенных стилей источником ошибок.

Всякий раз, применяя встроенные стили, хорошо подумайте, нельзя ли достичь того же результата, используя определение класса стилей. К примеру, лучше написать:

<style type="text/css">
<!--
p.centered {text-align: center}
em.blue {color: blue}
-->
</style>

а затем применить это определение:

<p class=centered>
<em class=blue>

чем использовать эквивалентную по результату конструкцию:

<p style="text-align: center">
<em style="color: blue">

Классы стилей легче находить и обслуживать, и их можно употреблять повторно в других документах.

Статьи по HTML на эту тему:

Стилевые свойства

Вернуться в раздел: HTML / 8. Каскадные таблицы стилей