Синтаксис CSS-

правил
CSS, або Cascading Style Sheets, - це мова опису зовнішнього
вигляду веб-сторінок. Вона використовується для
налаштування шрифтів, кольорів, розмірів, розташування та
інших аспектів HTML-елементів. CSS робить веб-сторінки
більш привабливими, зручними для користувачів та
адаптивними до різних пристроїв.
1. Селектор: ВКАЗУЄ, ДО
ЯКИХ HTML-
ЕЛЕМЕНТІВ
БУДЕ
ЗАСТОСОВАН
О ПРАВИЛО.

Приклади:

#main-content - ID з
.button - клас з h1 - заголовок
назвою "main-
назвою "button" першого рівня
content"
2. Блок
оголошень: ВМІЩУЄ ПАРИ
ВЛАСТИВІСТЬ
-ЗНАЧЕННЯ,
ЯКІ
ОПИСУЮТЬ
СТИЛІ.

Приклади:

color: red; - колір margin: 10px; -

font-size: 16px; - розмір
тексту червоний відступи з усіх боків 10
шрифту 16 пікселів
пікселів
3. Приклад правила:

h1 {
color: red;
font-size: 24px;
text-align: center;
}
 Тип: h1, h2, h3,
Типи
Клас: .button
p

селекторів ID: #main-

Псевдоклас:
:hover (при
content наведенні
курсору)

Псевдоелемен
т: ::before
(додати перед
елементом)
 Приклад:
CSS-правила каскадно застосовуються до
елементів. Це означає, що правило з більшою

Каска
специфікою буде мати пріоритет над правилом з
меншою.

дність
h1 {
color: red;
.button {
color: blue;
h1.button {
color: green;
В цьому прикладі заголовок першого рівня з
класом "button" буде зеленим, тому що правило
h1.button має більшу специфіку, ніж h1 та .button.
 Приклад:
Деякі властивості CSS успадковуються від

Спадку
батьківських елементів до дочірніх.
body {

вання font-family: Arial;

h1 {
font-size: 24px; }
В цьому прикладі заголовки першого рівня
успадкують шрифт Arial з тегу body
 CSS - це потужний інструмент для веб-
розробників. Вивчення CSS дозволить вам
створювати красиві, зручні та адаптивні веб-
сторінки.
Дякую за увагу