Класи застосовують, коли необхідно визначити стиль для індивідуального елемента веб-сторінки або задати різні стилі для одного тега.
Синтаксис
E.Імя_класса {Опис правил стилю}
.Імя_класса {Опис правил стилю}
Тут E — ; позначає будь-тег. Імена класів повинні починатися з латинського символу і можуть містити в собі символ дефіса (-) і підкреслення (_). Використання російських букв в іменах класів неприпустимо. Щоб вказати в коді HTML, що тег використовується з певним класом, до тегу додається атрибут class .
Приклад
HTML5 CSS 2.1 IE Cr Op Sa Fx
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>
Класи </title>
<style>
p { /* Звичайний абзац */ text-align: justify; /* Вирівнювання тексту по ширині */ } p.cite { /* Абзац з класом cite */ color: navy; /* Синій колір тексту */ margin-left: 20px; /* Відступ зліва */ border-left: 1px solid navy; /* Межа зліва від тексту */ padding-left: 15px; /* Відстань від лінії до тексту */ } </style>
</head>
<body>
<p>
Для штучного освітлення приміщення застосовуються люмінесцентні лампи. Вони відрізняються високою світловою віддачею, тривалим терміном служби, малої яскравістю світиться поверхні, близьким до природного спектральним складом випромінюваного світла, що забезпечує гарну передачу кольору. </p>
<p class="cite">
Для виключення засвічення екрану дисплея світловими потоками віконні прорізи забезпечені светорассеивающими шторами. </p>
</body>
</html>
Результат прикладу показаний на рис. 1.
Рис. 1. Вигляд тексту, оформленого за допомогою класу
Браузери
В Internet Explorer до версії 7.0 класи не працюють, якщо їх імена починаються з дефіса (-) або символу підкреслення (_).
