18.2 Getting started with CSS

• HTML is packed full of tags
• You use CSS to explain how each HTML element should look
• If the element has this tag … it should look like this

h2 {
  color: red;
}

//
selector {
  property: value;
}

Selecting elements based on different types of properties:

// examples from ui2() above

// eg `h2` or `div`
the-name {
  property: value;
}

// eg, `#what`
#the-id {
  property: value;
}

// eg, `.control-label`
.the-class {
  property: value;
}

You can combine the selectors together:

h1,h2    // either `h1` or `h2`
div h1   // an `h1` inside a `div`
div > h1 // an `h1` immediately inside a `div`
a:hover  // an `a`, but only when the user hovers over it

and so on.

See the wonderful tutorial at MDN for more on the various ways to select elements:

https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Selectors