Директиви

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

Синтаксис

Звичайний

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

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

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

@charset – Визначає множину символів, що використовується в таблиці стилів.
@import – Вказує рушієві CSS включити зовнішній список стилів.
@namespace – Вказує рушієві CSS, що весь вміст директиви повинен вважатися таким, що має префікс у межах простору імен XML.

Вкладений

@identifier (RULE) {
}

Підмножина вкладених інструкцій, що може вживатися як інструкція списку стилів, а також всередині умовних групових директив.

@media – Умовна групова директива, що застосовує свій вміст, якщо пристрій відповідає критеріям умови, визначеної за допомогою запиту медіа.
@scope – Умовна групова директива, що застосовує свій вміст, якщо пристрій відповідає критеріям заданої умови.
@starting-style – Умовна групова директива, що застосовує стартовий перехід, якщо браузер відповідає критеріям заданої умови.
@supports – Умовна групова директива, що застосовує свій вміст, якщо браузер відповідає критеріям даної умови.
@document – Умовна групова директива, що застосовує свій вміст, якщо документ, в якому застосовується список стилів, відповідає критеріям даної умови.
@page – Описує аспект змін компонування, що будуть застосовані при друку документа.
@font-face – Описує аспект зовнішнього шрифту до завантаження.
@keyframes – Описує аспект проміжних кроків у послідовності анімації CSS.
@counter-style – Визначає конкретні стилі лічильників, що не є частиною попередньо визначеного набору стилів.
@font-feature-values (плюс @swash, @ornaments, @annotation, @stylistic, @styleset і @character-variant) – Визначає загальні назви в font-variant-alternates для функцій, що активуються по-різному в OpenType.
@property – Описує аспект нетипових властивостей і змінних.
@layer – Оголошує шар каскаду і визначає порядок пріоритету в разі кількох шарів каскаду.

Умовні групові директиви

Доволі подібно до значень властивостей, кожна директива має власний синтаксис. А проте, декілька з них можуть бути згруповані в спеціальну категорію, що називається умовними груповими директивами. Ці інструкції мають спільний синтаксис, і кожна з них може містити вкладені інструкції — або набори правил, або вкладені директиви. Крім того, вони всі несуть спільне семантичне значення: всі вони посилаються на якийсь тип умови, яка в кожну мить часу оцінюється як істинна або хибна. Якщо умова оцінюється як істинна, то всі інструкції всередині групи будуть застосовані.

Умовні групові директиви:

@media,
@scope,
@starting-style,
@supports,
@document. (Відкладена до рівня 4 Специфікації CSS)

Оскільки кожна умовна група може містити вкладені інструкції, то може бути невизначена кількість вкладень.

Вкладення @layer при вкладеному CSS

Каскадні шари можна вкладати одне в одного, щоб створювати вкладені шари. Це робиться за допомогою . (крапки). Це також можна зробити за допомогою вкладення CSS.

Директиви

Синтаксис

Звичайний

Вкладений

Умовні групові директиви

Вкладення @layer при вкладеному CSS

Покажчик

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

See also

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