Директиви

Директиви – це інструкції CSS, що вказують CSS, як поводитися. Вони починаються зі знаку «равлика», @ (U+0040 COMMERCIAL AT), за яким слідує ідентифікатор, і включають усе до наступної крапки з комою, ; (U+003B SEMICOLON), або наступного блоку CSS, залежно від того, що зустрінеться першим.

Синтаксис

Директиви-інструкції

/* Загальна структура */
@identifier (RULE);

/* Приклад: вказує браузеру використовувати множину символів UTF-8 */
@charset "utf-8";

Директиви-інструкції закінчуються крапкою з комою. Є декілька директив-інструкцій, що визначаються їх ідентифікаторами, кожна з власним синтаксисом:

@charset

Алгоритм (має синтаксичну форму директиви, але не є визначенням), що визначає запасний набір символів, що використовується списком стилів (Синтаксис CSS).

@import

Вказує рушієві CSS включити зовнішній список стилів (Каскадність та успадкування CSS).

@layer

Визначає порядок пріоритету у випадку кількох каскадних шарів (Каскадність та успадкування CSS). Також вживається як директива-блок для визначення стилів шару.

@namespace

Визначає усталений простір імен для списку стилів або префікс простору імен, з яким селектор дає збіг лише тоді, коли простір імен і решта складових селектора збігаються (Простори імен CSS).

Директиви-блоки

@identifier (RULE) {
}

Директиви-блоки закінчуються блоком {}, що містить вкладені правила, інші директиви, або ж властивості чи оголошення дескрипторів.

  • @counter-style
    • : Визначає особливі стилі лічильника та розширює наперед визначені стилі списку (Стилі лічильників CSS).
  • @container
    • : Умовна групувальна директива, що застосовує свій вміст, якщо контейнер відповідає умовам <container-condition> (Утримання CSS).
  • @font-face
    • : Визначає розташування ресурсів шрифтів, як локальних, так і зовнішніх, поруч з характеристиками стилю, для яких ці ресурси вживаються, з оголошеним значенням font-family (Шрифти CSS).
  • @font-feature-values (а також @swash, @ornaments, @annotation, @stylistic, @styleset і @character-variant)
    • : Контролює виведення шрифту для кожного сімейства шрифту, визначаючи специфічні для шрифту альтернативи, або особливі назви, для додавання індексів у font-variant-alternates в OpenType (Шрифти CSS).
  • @keyframes (а також її псевдонім @-webkit-keyframes)
    • : Визначає названу анімацію, визначаючи стилі CSS для проміжних кроків (або ключових кадрів) у послідовності анімування (Анімації CSS).
  • @layer
  • @media
    • : Умовна групувальна директива, що застосовує свій вміст тільки тоді, коли пристрій відповідає критеріям умови, визначеної за допомогою медійного запиту (Умовні директиви CSS).
  • @page
    • : Задає аспекти сторінки для друку, наприклад, її розміри, орієнтацію та поля (Сторінкове медіа CSS).
  • @position-try
    • : Визначає варіанти власного розташування, що можуть вживатися для визначення запасних варіантів позиціювання та вирівнювання для елементів з якірним позиціюванням (Якірне позиціювання CSS).
  • @property
  • @scope
    • : Визначає область видимості, в якій стилі застосовуються до вибраних елементів, а також самі ці стилі, що застосовуються в цій області (Каскадність і успадкування CSS).
    • : Визначає початкові значення властивостей для початку переходу, коли елемент отримує своє перше оновлення стилів, наприклад, при переході від display: none (Переходи CSS).
  • @supports
    • : Умовна групувальна директива, що застосовує свій вміст, якщо браузер підтримує можливості CSS, вказані у певній умові (Умовні директиви CSS).
  • @view-transition
    • : Вмикає в документі переходи перегляду, а також у цільовому документі, як переходи відбуваються між документами.

Покажчик

Специфікації

Специфікація
CSS Conditional Rules Module Level 3 (CSS Conditional 3)

Дивіться також

Помітили помилку на цій сторінці?

Переглянути сирці на GitHub.

Редагувати вміст на GitHub.

Почати обговорення на GitHub стосовно вмісту цієї сторінки.