# The HTML You Need

CSS styles HTML, so this chapter teaches the HTML you need for the whole course: elements, tags and attributes, the page skeleton and the three places CSS can go, the structure elements, and the class and id attributes that CSS hooks onto.

Updated: November 10, 2026

## [HTML in a Nutshell](https://www.ask-codey.com/courses/css-in-depth/topics/css-html-in-a-nutshell)

1. [Elements, Tags and Attributes](https://www.ask-codey.com/lessons/css-html-elements-tags-and-attributes) (Novice): A web page is content with labels on it, called tags, and once you can read the labels you know exactly what your CSS will style.
2. [The Page Skeleton, and Three Places CSS Can Go](https://www.ask-codey.com/lessons/css-html-page-skeleton) (Novice): Every web page shares the same skeleton, a head for information about the page and a body for what people see, and CSS can go in three places in it, of which a linked stylesheet is the one real sites use.

## [Structure for Styling](https://www.ask-codey.com/courses/css-in-depth/topics/css-structure-for-styling)

1. [Structure Elements: header, nav, main, section and footer](https://www.ask-codey.com/lessons/css-html-structure-elements) (Novice): Structure elements such as header, nav, main and footer label the big parts of a page by what they are, which helps people using screen readers, search engines, and you when you style each part.
2. [Hooks for CSS: the class and id Attributes](https://www.ask-codey.com/lessons/css-html-class-and-id) (Novice): The class attribute gives a label that many elements can share and the id attribute names one element, and together they are the hooks CSS uses to style exactly the parts you mean.

## [Exercise: A Pet Adoption Page](https://www.ask-codey.com/courses/css-in-depth/topics/exercise-css-pet-adoption-page)

1. [Exercise: A Pet Adoption Page](https://www.ask-codey.com/lessons/exercise-css-pet-adoption-page) (Novice): Write Paws & Whiskers' whole "Meet Biscuit" page from a content sheet, with a skeleton, structure elements, a pet-card class and a linked stylesheet with two rules, and let the tests check every part.

Source: https://www.ask-codey.com/courses/css-in-depth/chapters/css-the-html-you-need
