... главная страницаКарта сайтаКонтакты

Главная
Синтаксис CSS
Свойства CSS
Форматирование блоков
Списки
Пример применения стилей
Оптимизация стилей
Оформление текстов
Использование блоков
Позиционирование
Слои в CSS
Готовые решения
Дополнительные возможности CSS
Программа TopStyle
Таблица цветов

 

Все свойства CSS

 
Яндекс.Метрика
 
 

Оптимизация таблиц стилей. Структура таблиц стилей.

 

 

 

Структура таблиц стилей ||  Оптимизация таблиц ||  Практический пример структуризации и оптимизации


Структуризация таблиц стилей

Не последнюю роль в удобстве чтения кода и уменьшении его объема играют структуризация и оптимизация таблицы стилей. Целям более удобного чтения служит, например, установленная ранее договоренность писать названия селекторов заглавными буквами, а названия свойств - строчными. Вообще говоря, язык CSS регистронезависимый, т.е. правила: р{COLOR: red} и P{color: ReD} будут равнозначны. Поэтому в первую очередь стоит определиться, в каком регистре вы будете набирать названия селекторов, свойств и их значений. И в дальнейшем следует строго придерживаться этого правила. Здесь мы продолжим пользоваться тем же правилом, которое установили в начале.

Структуризация таблицы стилей ставит своей целью расположение CSS-правил в ней в определенном порядке. В таблице стилей, структурированной особым образом, очень легко найти нужное правило. Сейчас рассмотрим несколько способов структуризации, а право выбрать наиболее подходящий я предоставляю вам.

Первый способ. Все правила в таблице стилей делятся на три группы в зависимости от типа селекторов. В первую попадают селекторы по элементу, во вторую - селекторы по классу, а в третью - селекторы по идентификатору.

Второй способ - по сути, слегка модифицированный первый. Единственное отступление - это то, что селекторы по классу для каждого элемента следуют непосредственно за селектором по этому элементу. Такой способ более удобен, когда вы не пользуетесь универсальным селектором для классов и идентификаторов. Напомню, что универсальный селектор в общем случае - это его отсутствие перед именем класса или идентификатора. Вот несколько примеров:

  • .firstheader в отличие от H1.f irstheader;
  • #menu в отличие от TD#menu.
Внутри каждой группы правила также лучше всего структурировать, например, по алфавиту. Тогда вы точно будете знать, что правило для ссылок с селектором А находится в самом начале таблицы стилей, а идентификатор #zero в самом ее конце.

 

Структура таблиц стилей ||  Оптимизация таблиц ||  Практический пример структуризации и оптимизации

 

Наверх страницы

 

Уроки CSS © 2007 - 2017 г. Все права защищены