Селектор - ім'я класу

Ім'я класу не є яким-небудь стандартним ім'ям елемента HTML-Розмітки. Воно визначає опис класу елементів розмітки, які будуть відображатися однаково. Для того, щоб віднести елемент розмітки до того або іншого класу, потрібно скористатися його атрибутом CLASS:

<STYLE>

.test{color:white;background-color:black;}

</STYLE>

...

<P>

Цей параграф ми відобразимо білим кольором по

чорному тлу

</P>

...

<P>

Цю <A>гіпертекстове посилання</A>

ми відобразимо білим кольором по чорному тлу.

</P>

Рис. 8.2. 

У такий спосіб у будь-якому елементі розмітки можна послатися на опис класу відображення. При цьому зовсім необов'язково, щоб елементи розмітки були однотипними. У прикладі до одного класу віднесені й параграф, і гіпертекстове посилання в іншому параграфі.

Лідируючу крапку в ім'ї класу можна опустити. Вона задається з міркувань збереження єдності опису. Наприклад, можна визначити класи відображення однотипних елементів розмітки:

a.menu { color:red;background-color:white;

        text-decoration:none; }

a.paragraph { color:navy;

             text-decoration:underline; }

У даному прикладі клас гіпертекстових посилань menu має один опис стилю, а клас гіпертекстових посилань paragraph - зовсім інше. При цьому кожний із цих класів не можна застосувати до інших елементів розмітки, наприклад, параграфу або списку. Якщо ім'я елемента розмітки не задано, це означає, що клас можна віднести до будь-якого елемента розмітки - кореневий клас опису стилів. Це дуже схоже на позначення ім'я кореневого домена в системі доменних імен. Властиво нічого дивного тут ні, тому що система класів об'єктів на HTML-Сторінці являє собою дерево. Елементи розмітки - це вузли дерева.