Оновлено: 19.05.2025
Class selector
Класи
Класи застосовують, коли необхідно визначити стиль для одного або декількох елементів веб-сторінки. Елементи при цьому можуть бути різними, але мати частково або повністю схожі елементи оформлення. У коді HTML ім'я класу визначається через атрибут class.
Синтаксис
E.<Ім'я класу> { Опис правил стилю }
.<Ім'я класу> { Опис правил стилю }Тут E - позначає будь-який елемент. Імена класів повинні починатися з латинського символу і можуть містити в собі символ дефіса (-) і підкреслення (_). Використання українських літер в іменах класів неприпустимо. Щоб указати в коді HTML, що елемент використовується з певним класом, до тега додається атрибут class.
Приклад
<!DOCTYPE html>
<html>
<head>
<metacharset="utf-8">
<title>Classes</title>
<style>
p { /* Normal paragraph */
text-align: justify; /* Justify text */
}
p.cite { /* A paragraph with the cite class */
color: navy; /* Blue text color */
margin-left: 20px; /* Indent left */
border-left: 1px solid navy; /* Border to the left of the text */
padding-left: 15px; /* Distance from line to text */
}
</style>
</head>
<body>
<p>For artificial lighting of the room, fluorescent lamps are used.
They are characterized by high luminous efficiency, long service life,
low brightness of the luminous surface, close to the natural spectral
the composition of the emitted light, which ensures good color rendering.</p>
<p class="cite">To prevent the display screen from being illuminated by light fluxes
window openings are equipped with light-diffusing curtains.</p>
</body>
</html>