MENU


Syntax and Rulesets

A style sheet holds two kinds of statement. A ruleset pairs a selector list with a declaration block in braces; each declaration is a property: value pair ending in a semicolon. An at-rule starts with @ and carries conditions or metadata, such as @media or @font-face (At-rules). Comments use /* ... */; CSS has no // comment.

Anatomy of a style sheetCSS
h1, .lead {                    /* selector list */
  color: #1565c0;              /* declaration: property: value; */
  font: 600 1.3rem system-ui;
  colour: red;                 /* unknown property: silently skipped */
}
@media (width >= 40rem) {      /* at-rule wrapping a nested ruleset */
  .lead { font-style: italic; }
}

Parsing is forgiving: an unknown property or invalid value skips only that declaration, so you can put a fallback on the line above new syntax.