Синтаксис
Формально жанр отображения элементов разметки задается ссылкой в элементе разметки на селектор жанра. Синтаксис изложения жанров в всеобщем виде представляется дальнейшим образом:
selector[, selector[, ...]]{attribute:value;[atribute:value;...]}
или
selector selector [selector ...] {attribute:value;[atribute:value;...]}
1-й вариант перечисляет селекторы, для которых действует данное изложение жанра. 2-й вариант задает иерархию вложенности селекторов, для общности которых определен жанр. Напомним, что речь в данном случае идет об изложениях жанров в нотации "text/css". Изложения жанров размещаются либо внутри элемента STYLE, либо во внешнем файле.
В качестве селектора дозволено применять: имя элемента разметки, имя класса и идентификатор объекта на HTML-странице.
Признак (attribute) определяет качество отображаемого элемента, скажем, левый отступ параграфа (margin-left), а значение (value) - значение этого признака, скажем, 10 типографских пунктов (10pt).
Когда автор Web-узла хочет определить всеобщий жанр всех страниц, то он примитивно прописывает жанры для всех элементов HTML-разметки, которые будут на страницах применяться. Это дает возможность скомпоновать страницы из логических элементов, а жанр отображения этих элементов описать во внешнем файле.
Такой метод конструирования сайта дозволяет автору изменять внешний вид всех страниц путем внесения изменений в файл изложения жанров, а не в файлы HTML-страниц.
Внешний файл при этом может выглядеть дальнейшим образом:
i, em {color:#003366,font-style:normal}
a i {font-style:normal;font-weight:bold;text-decoration:line-through}
Первая строка этого изложения перечисляет селекторы-элементы, которые будут отображаться идентично:
<i>>Это курсив</i> и это тоже <em>курсив</em>
Это курсив и это тоже курсив
Последняя строка определяет жанр отображения вложенного в гипертекстовую ссылку курсива:
<a name=empty><i>kuku</i></a>
kuku
В данном случае переопределение состоит в том, что текст отображается внутри гипертестовой ссылки перечеркнутым и "толсто".
[ начало страницы ]
Имя класса не является каким-нибудь стандартным именем элемента HTML-разметки. Имя класса определяет изложение класса элементов разметки, которые будут отображаться идентично. Для того, дабы отнести элемент разметки к определенному классу, необходимо воспользоваться признаком class этого элемента разметки:
<style>
.kuku {color:white;background-color:darkred;}
</style>
...
<p class=kuku>
Данный параграф мы отобразим белым цветом по темно-красному фону
</p>
...
<p>
Эту <a class=kuku>гипертекстовую ссылку</a> мы отобразим белым цветом по темно-красному фону.
</p>
Данный параграф мы отобразим белым цветом по темно-красному фону
Эту гипертекстовую ссылку мы отобразим белым цветом по темно-красному фону.
Как видно из этого примера, в любом элементе разметки дозволено сослаться на изложение класса отображения. При этом абсолютно не непременно, дабы элементы разметки были однотипными. В примере к одному классу отнесены и параграф и гипертекстовая ссылка в ином параграфе.
Главенствующую точку в имени класса дозволено спускать. Она задается из соображений сохранения общности изложения. Так, скажем, дозволено определить классы отображения однотипных элементов разметки:
a.menu {color:red;background-color:white;text-decoration:normal;}
a.paragraph {color:navy;text-decoration:underline;}
В данном примере класс гипертекстовых ссылок menu имеет одно изложение жанра, а класс гипертекстовых ссылок paragraph идеально другое. При этом весь из этих классов невозможно применить к иным элементам разметки, скажем, параграфу либо списку. Если не задано имени элемента разметки, то это обозначает, что класс дозволено отнести к любому элементу разметки - корневой класс изложения жанров. Это дюже схоже на обозначение имени корневого домена в системе доменных имен. Собственно ничего восхитительного тут нет, т.к. система классов объектов на HTML-странице представляет из себя дерево. Элементы разметки - это узлы дерева.
[ начало страницы ]
Объектная модель документа (Document Object Model) описывает документ как дерево объектов. Объектами являются: сам документ, разделы(элемент DIV), картинки, параграфы, приложения и т.п.. Весь из объектов дозволено поименовать и обращаться к нему по имени. Данная возможность применяется при программировании страниц на стороне заказчика, скажем, на JavaScript.
Использование идентификатора объекта оправдано еще и в случае модификации признака изложения жанра для данного объекта в его CSS-изложении. Взамен создания 2-х изложений классов, которые различаются только одним из параметров, дозволено сотворить одно изложение и изложение идентификатора объекта. Изложение жанра для объекта задается строкой, в которой селектор представляет собой имя этого объекта с главенствующим символом "#":
a.mainlink {color:darkred;text-decoration:underline;font-style:italic;}
#blue {color:#003366}
...
<a class=mainlink>основная гипертекстовая ссылка</a>
<a class=mainlink id=blue>модифицированная гипертекстовая ссылка</a>
...
основная гипертекстовая ссылка
модифицированная гипертекстовая ссылка
Следует оговориться, что интерпретации идентификаторов объектов в IE и NN различные. Дело в том, что существует еще признак name у элемента разметки. NN выбирает иметь дело именно с этим признаком при идентификации объекта, а IE с признаком id.
Отличия в интерпретации ID в браузерах при декларативном применении CSS не дюже ужасны. Все становится значительно дрянней, когда автор решится программировать жанры, т.е. изменять значения признаков описателей жанров. В этом случае разница объектных моделей документов в NN и IE проявится в полной мере. Реально, придется разрабатывать абсолютно различные страницы для всякого из браузеров.