How CSS Works

In the last lesson, we got CSS linked into our site and we changed the font. In this lesson, we'll go over how CSS works and some other ways to use CSS. Below was our code:

body {
    font-family: sans-serif;
}
  

Now, we will go over how the CSS code works.

Breaking It Down

On the first line, we have body {. This means that we want to apply our CSS to the body tag, which refers to the entire page. If we were to change it to a or something else like i, then our CSS, at least in our example, would affect that. By using body, it affects EVERYTHING in the body, including all of the other tags! In other words, the CSS properties cascade. This is why CSS is called Cascading Style Sheets.

This is useful if you want to change the background color of the WHOLE PAGE or the font of the whole page.

On the next line, we have font-family: sans-serif;. This means to make the font-family, or the font, a sans-serif font. We could've changed it to another font like Segoe UI to make it a different font.

Finally, on the very last line, we end of with a closing curly bracket (}). This tells CSS to end our CSS statement and to begin a new one.