Your First CSS Rule
Learn the anatomy of a CSS rule: selector + declaration block.
Step 1 of 4
The anatomy of a CSS rule
A CSS rule has two parts: a SELECTOR (which elements to style) and a DECLARATION BLOCK (what styles to apply). This structure exists because it would be impractical to style each element individually — imagine writing colors and sizes for every single paragraph on a 1000-paragraph website. Instead, CSS lets you write one rule that applies everywhere. The declaration block uses curly braces { } and property: value pairs ending with semicolons.
Think of it this way: Think of a company dress code: 'All employees in the marketing department must wear blue shirts.' The selector is 'marketing department' (who), and the declaration is 'blue shirts' (what). One rule affects everyone who matches — that's the power of CSS selectors.
Web Standard
A CSS rule has two parts: a selector (which elements to style) and a declaration block (how to style them). This selector-based approach is what makes CSS powerful — one rule can style hundreds of elements.
Learn more on MDN
CSSREAD ONLY
CSS PREVIEW
h1 {
color: blue;
font-size: 32px;
}