Урок 72 із 239
30%
← Назад

Приоритет селекторов CSS

Разберем порядок применения CSS правил и узнаем, какое свойство имеет больший приоритет.

Приоритет CSS правил

Если один и тот же элемент получает несколько одинаковых CSS свойств, браузер применяет правило, которое находится ниже в CSS коде.

p {
  color: red;
}

p {
  color: green;
}

В данном примере первый стиль задает абзацам красный цвет, но второй стиль находится ниже и переопределяет первый. Поэтому текст будет зеленым.

Практическое задание

📌 Завдання:
  1. Расскажите, какого размера будут заголовки после выполнения следующего кода:
  2. <h2>text</h2> h2 { font-size: 20px; } h2 { font-size: 30px; }
💡 Показати підказку

Если селекторы имеют одинаковый приоритет, побеждает правило, которое написано ниже.

✅ Показати відповідь
Размер заголовка будет 30px, потому что второе правило h2 находится ниже и переопределяет первое.