CSS. Классы
Если нужно определить стиль так, чтобы один и тот же элемент в разных случаях отображался по-разному, то на помощь приходят классы.
Класс описывается в виде .имя_класса {свойства}. Для присвоения класса выбранному тегу используется свойство CLASS="имя_класса".
Это можно продемонстрировать на следующем примере:
Код | Отображение |
<STYLE TYPE="text/css">
.font1 {color: yellow; background: red;}
.font2 {color: blue; background: yellow;}
</STYLE>
...
<SPAN CLASS="font1">Желтый текст на красном фоне</SPAN>
<SPAN CLASS="font2">Синий текст на зеленом фоне</SPAN>.
А здесь цвет фона и текста заданы по умолчанию.
|
Желтый текст на красном фоне
Синий текст на зеленом фоне.
А здесь цвет фона и текста заданы по умолчанию.
|
В примере прописаны два класса "font1" и "font2" задающие цвет фона и изображения.
Эти классы были применены к тегу <SPAN>.
Свойства, прописываемые классом, могут быть присвоены любому тегу (если он обладает свойствами, описанными в классе).
Например, класс font1, определенный в предыдущем примере может быть применен к таблице:
Код | Отображение |
<TABLE CLASS="font1">
<TR><TD>Это ячейка таблицы</TD><TD>И это тоже</TD></TR>
<TABLE>
|
Это ячейка таблицы | И это тоже |
|
Для определения класса для определенного тега используется конструкция имя_тега.имя_класса {свойства}.
Например, нам нужно часть текста выделить красным. Определим класс для тега <FONT>:
Код | Описание |
<STYLE TYPE="text/css">
FONT.select {color: red;}
</STYLE>
...
Здесь мы выделили <FONT CLASS="select">часть текста</FONT>.
|
Здесь мы выделили часть текста.
|
Если Вы решили поменять стиль выделения текста с помощью класса "select" во всем документе с красного, на
другой цвет, то достаточно поменять значение цвета в одном месте - в определении этого класса.
А изменения вступят в силу сразу же во всем документе.
Если на всех страницах сайта подключается один и тот же стилевой файл,
то изменение свойств класса в этом файле приведет и к изменению стиля соответствующий тегов на всех страницах сайта.
В этом и заключается вся прелесть каскадных таблиц стилей.