CSS Ruleset Terminology
I was trying to think of the name of a thing in the CSS vernacular the other day. It made me think we should have some kind of reference right here on CSS-Tricks, as a site with CSS in the title probably ought to have! So, here’s the basics.
Breaking that down…
- The whole thing is a ruleset.
- The curly braces and everything inside is a declaration block.
- The bit before the opening curly brace is a selector.
- Each key/value pair, as separated by a colon and ending in a semicolon, is a declaration.
- In those key/value pairs, the key is a property (or property name), and the value is a value (or property value).
Marco Biedermann once created this diagram out of HTML and CSS itself, which I think is exceedingly clever:
See the Pen CSS Terminology by Marco Biedermann (@marcobiedermann) on CodePen.
More
- Louis Lazaris: CSS Terms and Definitions
- Divya Manian: CSS Vocabulary
- MDN: Syntax
CSS Ruleset Terminology is a post from CSS-Tricks
LEAVE A REPLY
You must be logged in to post a comment.