Regular At-Rule

A regular at-rule is a CSS rule designed specifically for initializing the CSS engine at the startup stage. Therefoe regular @rule can be used as a CSS statement to instruct how the CSS engine to behave.

@import At-Rule

Features

'@import'1,2,2.1~~last updated 11 Jul 2016~~

to specify those to be included external style sheets by importing

Form: @import url; | @import url list-of-media-queries;Parameter: @import@import at-rule with identifier "import"url A <string> or a <url> representing the location of the resource to import. The URL may be absolute or relative. list-of-media-queries A comma-separated list of media queries conditioning the application of the CSS rules defined in the linked URL. If the browser does not support any these queries, it does not load the linked resource. Syntax: @import [ <string> | <url> ] [ <media-query-list> ]?; <q class="dbl"> where <media-query-list> = <media-query># where <media-query> = <media-condition> | [ not | only ]? <media-type> [ and <media-condition-without-or> ]? where <media-condition> = <media-not> | <media-and> | <media-or> | <media-in-parens> <media-type> = <ident> <media-condition-without-or> = <media-not> | <media-and> | <media-in-parens> where <media-not> = not <media-in-parens> <media-and> = <media-in-parens> [ and <media-in-parens> ]+ <media-or> = <media-in-parens> [ or <media-in-parens> ]+ <media-in-parens> = ( <media-condition> ) | <media-feature> | <general-enclosed> where <media-feature> = ( [ <mf-plain> | <mf-boolean> | <mf-range> ] ) <general-enclosed> = [ <function-token> <any-value> ) ] | ( <ident> <any-value> ) where <mf-plain> = <mf-name> ： <mf-value> <mf-boolean> = <mf-name> <mf-range> = <mf-name> [ '<' | '>' ]? '='? <mf-value> | <mf-value> [ '<' | '>' ]? '='? <mf-name> | <mf-value> '<' '='? <mf-name> '<' '='? <mf-value> | <mf-value> '>' '='? <mf-name> '>' '='? <mf-value> where <mf-name> = <ident> <mf-value> = <number> | <dimension> | <ident> | <ratio> </q>Remarks: @import at-rule is used to import style rules from other specified style sheets @import at-rule must be placed after @charset at-rule and before all other types of CSS rules such that required style rules are retrieved before any rendering style rules. @import at-rule is a regular @rule and cannot be placed inside conditional group at-rules. @import at-rule with media-query is a conditional import, otherwise the import is unconditional. Specifying all for the medium has the same effect. css1:initial;css2.1:support <string>;Media Queries:support media-queries.Reference: https://developer.mozilla.org/en-US/docs/Web/CSS/@import

Examples

css1: <url>
@import url(http://sideway.hk/style/default/std01b.css)
css1: <url>
@import url(std01b.css)
css2,2.1: <string>
@import "common.css"
css2,2.1: <url>
@import url("common.css")
css2,2.1: <url> @media wrapped
@import url("common.css") print, tv
css2,2.1,Media Queries: <url> with Media queries
@import url("common.css") print, tv and (orientation:landscape)

@charset At-Rule

Features

'@charset'2.1~~last updated 08 Mar 2019~~

to specify the character encoding of the style sheet itself

Form: @charset char_setParameter: @charset@charset at-rule with identifier "charset"char_set A double-quoted<string> used to specify the character encoding of the style sheet itsel. The string of charset must be the name of a web-safe character encoding defined in the IANA-registry. The form of the statement is exactly one space character (U+0020) after the '@charset' at-rule, and immediately terminated with a semicolon. Syntax: @charset "<charset>";Remarks: If several names are associated with an encoding, only the one marked with preferred must be used. An @charset rule must place the rule at the very beginning of the style sheet, preceded by no characters. any @charset rule not at the beginning of the style sheet will be ignored. @charset must be written literally. @charset rules should only function if they are in the encoding of the style sheet.Reference: https://developer.mozilla.org/en-US/docs/Web/CSS/@charset