At-rules
are
CSS 语句
that instructs CSS how to behave. They begin with an at sign, '
@
' (
U+0040 COMMERCIAL AT
), followed by an identifier and includes everything up to the next semicolon, '
;
' (
U+003B SEMICOLON
), or the next
CSS block
, whichever comes first.
/* General structure */ @IDENTIFIER (RULE); /* Example: tells browser to use UTF-8 character set */ @charset "utf-8";
There are several at-rules, designated by their identifiers, each with a different syntax:
@charset
— Defines the character set used by the style sheet.
@import
— Tells the CSS engine to include an external style sheet.
@namespace
— Tells the CSS engine that all its content must be considered prefixed with an XML namespace.
@media
— A conditional group rule that will apply its content if the device meets the criteria of the condition defined using a
media query
.
@supports
— A conditional group rule that will apply its content if the browser meets the criteria of the given condition.
@document
— A conditional group rule that will apply its content if the document in which the style sheet is applied meets the criteria of the given condition.
(deferred to Level 4 of CSS Spec)
@page
— Describes the aspect of layout changes that will be applied when printing the document.
@font-face
— Describes the aspect of an external font to be downloaded.
@keyframes
— Describes the aspect of intermediate steps in a CSS animation sequence.
@viewport
— Describes the aspects of the viewport for small screen devices.
(currently at the Working Draft stage)
@counter-style
— Defines specific counter styles that are not part of the predefined set of styles.
(at the Candidate Recommendation stage, but only implemented in Gecko as of writing)
@font-feature-values
(plus
@swash
,
@ornaments
,
@annotation
,
@stylistic
,
@styleset
and
@character-variant
)
font-variant-alternates
for feature activated differently in OpenType.
(at the Candidate Recommendation stage, but only implemented in Gecko as of writing)
Much like the values of properties, each at-rule has a different syntax. Nevertheless, several of them can be grouped into a special category named conditional group rules . These statements share a common syntax and each of them can include nested statements —either rulesets or nested at-rules . Furthermore, they all convey a common semantic meaning—they all link some type of condition, which at any time evaluates to either true or false . If the condition evaluates to true , then all of the statements within the group will be applied.
Conditional group rules are defined in CSS Conditionals Level 3 and are:
Since each conditional group may also contain nested statements, there may be an unspecified amount of nesting.
| 规范 | 状态 | 注释 |
|---|---|---|
| CSS Conditional Rules Module Level 3 | 候选推荐 | 初始定义 |
|
Compatibility Standard
The definition of 'CSS At-rules' in that specification. |
实时标准 |
Standardizes
@-webkit-keyframes
.
|