output.to from Sideway

Internet Unicode HTML~~CSS~~Scalable Vector Graphics (SVG)Extensible Markup Language (xml)ASPx Document Object Model (DOM)JavaScript ASP Misc. Resources

TOC Cascading Style Sheets~~CSS Element~~Rendering Property CSS Property Values Knowledge Base How To FAQ

CSS Features~~CSS at-rule (@ rule)~~CSS Selector

~~CSS at-rule (@ rule)~~CSS Regular @rule CSS Ordinary Nested @rule CSS Conditional Nested @rule

`-=[]⟨⟩\;',./~!@#$%^&*()_+{}|:"<>? 𝑎𝑏𝑐𝑑𝑒𝑓𝑔ℎ𝑖𝑗𝑘𝑙𝑚𝑛𝑜𝑝𝑞𝑟𝑠𝑡𝑢𝑣𝑤𝑥𝑦𝑧 Å − × ⋅∓±∘꞊﹦∗∙ ℯ 𝔸𝔹ℂ𝔻𝔼𝔽𝔾ℍ𝕀𝕁𝕂𝕃𝕄ℕ𝕆ℙℚℝ𝕊𝕋𝕌𝕍𝕎𝕏𝕐ℤ𝐴𝐵𝐶𝐷𝐸𝐹𝐺𝐻𝐼𝐽𝐾𝐿𝑀𝑁𝑂𝑃𝑄𝑅𝑆𝑇𝑈𝑉𝑊𝑋𝑌𝑍 ∼∽∾≁≂≃≄≅≆≇≈≉≌≐≠≡ ≤≥≦≧≨≩≪≫ ∈∉∊∋∌∍ ⊂⊃⊄⊅⊆⊇ 𝛼𝛽𝛾𝛿𝜀𝜁𝜂𝜃𝜄𝜅𝜆𝜇𝜈𝜉𝜊𝜋𝜌𝜎𝜏𝜐𝜑𝜒𝜓𝜔 ∀∂∃∅⦰∆∇∎∞∝∴∵ ∏∐∑⋀⋁⋂⋃ ∧∨∩∪ ∫∬∭∮∯∰∱∲∳ ∥⋮⋯⋰⋱ ‖ ′ ″ ‴ ⁄ ⁗ ʹ ʺ ‵ ‶ ‷ ﹁﹂﹃﹄︹︺︻︼ ︗ ︘ ︿﹀︽︾﹇﹈︷︸ ⏜ ⏝ ⎴ ⎵ ⏞ ⏟ ⏠ ⏡ ←↑→↓↤↦↥↧↔↕↖↗↘↙▲▼◀▶↺↻⟲⟳ ↼↽↾↿⇀⇁⇂⇃⇄⇅⇆⇇ ⇐⇑⇒⇓⇔⇌⇍⇏⇕⇖⇗⇘⇙⇙⇳⥢⥣⥤⥥⥦⥧⥨⥩⥪⥫⥬⥭⥮⥯

Draft for Information Only

Content

At-Rule
 Syntax of At-Rule
 Types of At-Rule
  Regular At-Rule
  Nested At-Rule
   Ordinary Nested At-Rule
   Conditional Nested At-Rule

At-Rule

An at-rule is a CSS rule for the CSS engine instead of matching with the element tag. Therefoe the @rule can be used as a CSS statement to instruct how the CSS engine to behave.

Syntax of At-Rule

An at-rule statement begins with an at sign, "@ (U+0040)", followed by a keyword identifier, and ends with a semicolon, "; (U+0030)" or the next CSS block "{⋯}".

@identifier (rule);
        
@identifier (rule) {⋯}

Types of At-Rule

There are a few types of at-rule with different syntax according to the function.

Regular At-Rule

The identifier is used to identify the function and the following rule is usually the corresponding value to be specified. The regular at-rule is specific CSS rule for initializing the CSS engine.

List of Regular At-Rule'@charset'2.1to specify the character encoding of the style sheet itself

Link: ./../../sideway/default.asp?qno=190400026~~last updated 08 Mar 2019~~'@import'1,2,2.1to specify those to be included external style sheets by importing

Link: ./../../sideway/default.asp?qno=190400026~~last updated 11 Jul 2016~~'@namespace' to specify the XML namespaces to be used in a CSS style sheet.

Link: ./../../sideway/default.asp?qno=190400026~~last updated 08 Mar 2019~~

Nested At-Rule

The identifier is used to identify the function and the following rule can contain a subset of additional statements that may also be nested, is usually the corresponding value to be specified. The nested at-rule is a general CSS rule that can be used as a general style sheet statement and a rule set inside conditional group ruels. According to the nature of nested at-rule, teh nested at-rule can further be grouped into ordinary nested at-rule and conditional nested at-rule, also called conditional group rule.

Ordinary Nested At-Rule

The ordinary nested at-rule is used as a ordinary specific CSS rule for CSS engine in CSS style sheet along with CSS rule set for elements. The identifier is used to identify the function and the following rule is usually the corresponding value to be specified.

List of Ordinary Nested At-Rule'@page'2,2.1to specify some specific CSS rules for paged media.

Link: ./../../sideway/default.asp?qno=190400027~~last updated 08 Mar 2019~~

@font-face An @font-face at-rule is used to specify the external font needed by the style sheet and nest the detailed information of the corresponding font in the additional statement subset. @font-face { font-family: 'WebFont'; src: url('webfont.woff2') format('woff2'); }

Conditional Nested At-Rule

List of Ordinary Nested At-Rule'@media'2,2.1to specify some CSS rules for specified media types conditionally

Link: ./../../sideway/default.asp?qno=190400028~~last updated 08 Mar 2019~~

@media An @media at-rule is a media matching rule used to specify the nested subset of additional CSS statement according to the specified conditions. @media only screen and (max-width: 600px) { body { background-color: lightblue;}}

©sideway

ID: 190400025 Last Updated: 4/25/2019 Revision: 0 Ref: