Skip to main content

Як задати стилі всім елементам на сторінці?

Щоб задати стилі всім елементам на сторінці, використовують універсальний селектор *. Він вибирає абсолютно кожен HTML-елемент.


Приклад

css
* { margin: 0; padding: 0; box-sizing: border-box; }

У цьому прикладі правило застосується до всіх елементів без винятку.


Особливості універсального селектора

  • охоплює всі елементи: теги, псевдоелементи (::before, ::after) і вкладені вузли
  • корисний для глобальних правил (наприклад, скидань і єдиних базових налаштувань)
  • але не варто застосовувати до нього забагато стилів, щоб не сповільнювати рендер і не втратити гнучкість керування елементами

Альтернативний варіант

Іноді глобальні правила задають для html і body, якщо потрібен вплив на всю сторінку, але не на кожен елемент:

css
html, body { font-family: Arial, sans-serif; background: #fff; }

Підсумок: якщо потрібно дійсно застосувати стиль до всіх елементів, використовують універсальний селектор *. Якщо потрібен майже глобальний ефект, але без тотального охоплення, стилізують html і body.

Коротка відповідь

Для співбесіди
Premium

Коротка відповідь допоможе вам впевнено відповідати на цю тему під час співбесіди.