CSS Introduction

Definition: CSS styles your HTML. A CSS rule has a selector (which elements to style) and a set of declarations (what to change), each a property: value pair.

The shape of a rule

p {
  color: green;
  font-size: 18px;
}

This says: find every <p> (the selector), and make its text green and 18px (the declarations inside the braces).

Three ways to add CSS

• Internal — in a <style> block (what we use here)
• External — in a separate .css file linked to the page (best for real sites)
• Inline — a style="..." attribute on one element (quick, but avoid overusing)

Selectors

Target by tag (p), by class (.box), or by id (#main). Classes are the most common.

💡 Tip: edit the colour and size below and press Run to watch the text change.