concept
A at-rule is a CSS statement to @begin with, followed 标识符, finally ；ending
We more or less have to have used @ rule, there may be some stranger to this concept.
Common rules @rule
@charset
The character encoding used in the definition of the style sheet, he must be written in the very beginning of the style sheet and can not have in front of other characters.
/* @charset "<charset>"; */
@charset "UTF-8" ;
@import
For introducing external css stylesheet
@import 'custom.css';
@import url("fineprint.css") print;
@namespace
@ Rules used to define the xml namespace using css stylesheet
/* @namespace <namespace-prefix>? [ <string> | <url> ]; */
@namespace url(http://www.w3.org/1999/xhtml);
@namespace svg url(http://www.w3.org/2000/svg);
@media
It is used to define one or more device types, specific characteristics and environmental media queries to apply styles
/* @media */
@media screen and (min-width: 900px) {
h1 {color:red;font-size:14px;
}
}
@page
To modify certain CSS properties when you print the document. @pageRules can only be modified margin, orphans, widowand page breaks of the documentmodify other attributes are invalid.
@keyframes
By defining key frames in the animation sequence is controlled not animation step css
@keyframes slidein {
from {
margin-left: 100%;
width: 300%;
}
to {
margin-left: 0%;
width: 100%;
}
}
@supports
Set of rules used to detect the rule is in effect. Rules and @mediasimilar
@viewport
Characteristics for setting a viewport (the viewport) of
@counter-style
Counter is used to define the style
@ Font-face
To the web page specified font file
@doucment
@documentIf the set of conditions to meet the conditions , then the rule to take effect (deferred to CSS Level 4 specification