CSS2. Спецификация. Рекомендации W3C. 1998
Установка значений свойств, Каскадирование и Наследование
предыдущий следующий содержание свойства индекс
Содержание
6.1 Специфицированные, вычисленные и текущие значения
После того, как ПА разобрал документ и сконструировал дерево документа, он обязан назначить каждому элементу дерева значение для каждого свойства, применимое для целевого типа носителя.
Конечное значение свойства является результатом трёхступенчатого процесса вычисления: значение определяется по спецификации ("специфицированное значение"), затем, если необходимо, выводится абсолютное значение ("вычисленное значение") и наконец - трансформируется в соответствии с ограничениями локальной среды ("реальное значение").
6.1.1 Специфицированные значения
ПА обязаны сначала назначить свойству специфицированное значение на основе следующих механизмов (по приоритету):
Не имея предков, корневой элемент дерева документа не может использовать значения, унаследованные от элемента-предка; в этом случае используется, если необходимо, начальное значение.
6.1.2 Вычисленные значения
Специфицированные значения могут быть абсолютными (т.е. не специфицированными относительно других значений: 'red' или '2mm') или относительными (т.е. специфицированными относительно других значений: 'auto', '2em', '12%'). Для абсолютных значений не требуется никаких вычислений, чтобы найти вычисленное значение.
Относительные значения, с другой стороны, обязаны быть трансформированы в вычисленные значения: процентные рассчитываются относительно данного значения-ссылки (каждое свойство определяет соответствующее значение), значения с указанием единиц измерения (em, ex, px) должны быть сделаны абсолютными путём применения подходящих по размеру шрифтов или в пикселах, значения 'auto' должны высчитываться по формулам, данным для каждого свойства, ключевые слова ('smaller', 'bolder', 'inherit') должны быть замещены в соответствии со своими определениями.
В большинстве случаев элементы наследуют вычисленные значения. Однако есть некоторые свойства, чьи специфицированные значения могут наследоваться (например, числовое значение свойства 'line-height'). В тех случаях, когда дочерние элементы не наследуют вычисленные значения, это описывается в определении свойства.
6.1.3 Реальные значения
Вычисленное значение в принципе готово для использования, но ПА могут не иметь возможности использовать такое значение в имеющемся окружении. Например, ПА могут иметь возможность представлять рамки лишь размером в целое число пикселов и, следовательно, должны сделать приближение до вычисленной ширины. Реальное значение - это вычисленное значение после выполнения некоторого приближения.
6.2 Наследование
Некоторые значения наследуются потомками элемента в дереве документа. Каждое свойство определяет, наследуется оно или нет.
Предположим, имеется элемент H1 с выделенным элементом (EM) внутри:
<H1>>e head line <EM>is </EM>important!</H1>
Если цвет элементу EM не назначен, выделенное "is" будет наследовать цвет элемента-предка, и, поскольку H1 имеет голубой цвет, элемент EM будет, соответственно, голубым.
Чтобы установить свойство стиля "по умолчанию" в документе, авторы могут установить это свойство в корне дерева документа. В HTML, например, эту функцию могут выполнить элементы HTML или BODY. Заметьте, что это будет работать, даже если автор опустит тэг BODY в тексте HTML, поскольку разборщик HTML вставит отсутствующие тэги.
Пример:
Например, поскольку свойство 'color' наследуется, все потомки элемента BODY будут наследовать цвет 'black':
BODY{color:black}
Специфицированные процентные значения не наследуются, а вычисленные значения - наследуются.
Пример:
В данной таблице:
BODY{font-size:10pt}H1{font-size:120%}
и в этом фрагменте документа:
<BODY><H1>A <EM>large</EM>heading</H1>
свойство 'font-size' элемента H1 будет иметь вычисленное значение'12pt' (120% от 10pt, значения-предка). Поскольку значение свойства 'font-size' наследуется, элемент EM также получит вычисленное значение '12pt'. Если ПА не имеет доступного шрифта в 12pt, реальное значение 'font-size' и для H1, и для EM может быть, например, '11pt'.
6.2.1 Значение 'inherit'
Каждое свойство может иметь специфицированное значение 'inherit', которое означает, что для данного элемента свойство принимает то же самое вычисленное значение, что и свойство элемента-предка. Наследуемое значение, которое как правило используется только как возвращаемое значение, может быть усилено путём явной установки 'inherit'.
Пример:
В следующем примере свойства 'color' и 'background' установлены в элементе BODY. Во всех других элементах значение 'color' будет наследоваться, а фон будет прозрачным. Если эти правила являются частью пользовательской таблицы стилей, чёрный текст на белом фоне будет форсирован по всему документу.
BODY{color:black!important;background:white!important}*{color:inherit!important;background:transparent}
6.3 Правило @import
Правило '@import' даёт пользователям возможность импортировать правила стиля из других таблиц стилей. Любое правило @import обязано предшествовать всем наборам правил в таблице стилей. После ключевого слова '@import' обязан следовать URI подключаемой таблицы стилей. Допустима также строка; она будет интерпретироваться так, как будто имеет вокруг себя url(…).
Пример:
Следующие строки эквивалентны по значению и обе иллюстрируют синтаксис '@import' (1 с "url()", а другое - с простой строкой):
@import mystyle.css;@import url(mystyle.css)
Поскольку ПА могут исключать запрос ресурсов неподдерживаемых типов носителя, авторы могут специфицировать медиа-зависимые правила @import. Эти условные @import специфицируют список разделённых запятыми типов носителя после URI.
Пример:
Следующие правила имеют такой же эффект, как если бы импортированная таблица стилей была перенесена в правило @media для того же типа, но данные правила позволят исключить бесполезную нагрузку на ПА.
@import url(fineprint.css")print;@import url(bluish.css")projection,tv;
При отсутствии любых типов носителя, импорт является безусловным. Спецификация 'all' для носителя имеет тот же эффект.
6.4 Каскад
Таблицы стилей могут иметь 3 независимых источника: автор, пользователь и ПА.
Учтите, что таблица стилей по умолчанию может быть изменена, если системные настройки изменены пользователем (например, системные цвета). Однако, из-за ограничений конкретной реализации ПА, может оказаться невозможным изменить значения в таблице стилей по умолчанию.
Области видимости таблиц стилей из этих 3 источников будут перекрываться и взаимодействовать в соответствии с каскадом.
Каскад CSS назначает вес каждому правилу стиля. Если применяются несколько правил, одно, имеющее больший вес, будет иметь приоритет.
По умолчанию правила авторской таблицы стилей имеют больший вес, чем правила таблицы стилей пользователя. Преимущество зарезервировано, однако, для правил "!important". Все правила пользователя и автора имеют больший вес, чем правила таблицы стилей по умолчанию в ПА.
Импортируемы таблицы стилей также каскадируются, и их вес зависит от порядка импортирования. Правила, специфицированные в имеющейся таблице стилей, переопределяют правила, импортируемые из других таблиц. Импортированные таблицы стилей сами могут импортировать и переопределять другие таблицы стилей рекурсивно, и тогда применяются те же правила приоритета.
6.4.1 Порядок каскадирования
Чтобы найти значение для комбинации элемент/свойство, ПА обязаны применять следующий порядок сортировки:
Независимо от установок "!important" индивидуальных объявлений, эта стратегия даёт авторским таблицам стилей больший вес, чем таблицам читателя. Это тем более важно, поскольку ПА предоставляют пользователю возможность отключить влияние определённых таблиц стилей, например, в выпадающих меню.
6.4.2 Правила !important
CSS пытается создать баланс между авторскими и пользовательскими таблицами стилей. По умолчанию правила авторской таблицы стилей переопределяют правила пользовательской таблицы (см.каскадное правило 3).
Однако, для баланса, объявление "!important" (ключевое слово "!" и "important" следуют за объявлением) имеет преимущество перед нормальной декларацией. И авторские, и пользовательские таблицы стилей могут содержать объявление "!important", и пользовательские правила "!important" переопределяют авторские "!important". Это свойство CSS улучшает доступность документов путём предоставления пользователям со специфическими требованиями (крупные шрифты, комбинации цветов и т.п.) контроля над представлением.
Примечание. Это семантическое изменение в сравнении с CSS1. В CSS1 авторские правила "!important" имели приоритет перед пользовательскими правилами "!important".
Объявление сокращённого свойства (например, 'background') как "!important" эквивалентно объявлению всех его подсвойств как "!important".
Пример:
1-е правило пользовательской таблицы стилей в данном примере содержит объявление "!important", которое переопределяет соответствующее объявление в авторской таблице стилей. 2-е объявление также будет иметь приоритет как помеченное "!important". Однако 3-е правило пользовательской таблицы стилей - не "!important" - и поэтому будет отброшено в пользу 2-го правила авторской таблицы стилей (которое устанавливает стиль сокращённого свойства). Таким образом, 3-е авторское правило будет отброшено в пользу 2-го авторского правила, поскольку 2-е правило - "!important". Это показывает, что объявления "!important" имеют действие также и внутри авторских таблиц стилей.
/*Из пользовательской таблицы стилей*/p{text-indent:1em!important}p{font-style:italic!important}p{font-size:18pt} /*Из авторской таблицы стилей*/p{text-indent:1.5em!important}p{font:12pt sans-serif!important}p{font-size:24pt}
6.4.3 Вычисление специфики селектора
Специфика селектора высчитывается так:
Конкатенация 3 чисел a-b-c (в числовой системе с большой базой) дают специфику.
Пример:
*{}/*a=0 b=0 c=0 ->специфика = 0*/lI{}/*a=0 b=0 c=1 ->специфика = 1*/UL LI{}/*a=0 b=0 c=2 ->специфика = 2*/UL OL+LI{}/*a=0 b=0 c=3 ->специфика = 3*/H1 + *[REL=up]{}/*a=0 b=1 c=1 ->специфика = 11*/UL OL LI.red{}/*a=0 b=1 c=3 ->специфика = 13*/lI.red.level{}/*a=0 b=2 c=1 ->специфика = 21*/ #x34y{}/*a=1 b=0 c=0 ->специфика = 100*/
В HTML значения атрибута "style" элемента являются правилами таблицы стилей. Эти правила не имеют селекторов, но для целей шага 3 каскадного алгоритма они рассматриваются как имеющие селектор ID (специфика: a=1, b=0, c=0). Для целей шага 4 они рассматриваются после всех других правил.
<STYLE> #x97z{color:blue} </STYLE> <P ID=x97z style=color:red>
В данном примере цвет элемента P будет красным. Хотя специфика - 1 и та же для обоих объявлений, объявление атрибута "style" переопределит объявление в элементе STYLE в соответствии с каскадным правилом 4.
6.4.4 Старшинство не-CSS подсказок
ПА могут предпочесть подсказки (hints) из других источников, а не из таблиц стилей, например, элемент FONT или атрибут "align" в HTML. Если это так, не-CSS подсказки обязаны быть переведены в соответствующие правила CSS со спецификой=0. Принимается, что правила находятся в начале авторской таблицы стилей и могут быть переопределены последующими правилами таблиц стилей.
Примечание. В фазе переноса эта политика облегчит сосуществование стилистических атрибутов с таблицами стилей.
Примечание. В CSS1 не-CSS подсказки получали специфику=1, а не 0. Это изменение сделано из-за введения универсального селектора, имеющего специфику 0.