Workshop › My business card › Step 4 of 12

Your first CSS

What we are doing

HTML says what is on the page; CSS says how it looks. CSS goes in a <style> tag in the page's head. We start with the whole page: a cleaner font and a soft background.

```html
<style>
  body {
    font-family: sans-serif;
    background: #f1f5f9;
  }
</style>
```

What it means

• A CSS rule: a selector (body, the whole page), then { } with property: value; lines.
• font-family: sans-serif switches to a plain font without little feet on the letters.
• background: #f1f5f9 paints the page a very light grey-blue.

Your turn

Write the <style> block under the <title> line.

Skills: Styling with CSS

← Put them in a box Make the box look like a card →

All steps

1. Your name as a heading
2. A line about you
3. Put them in a box
4. Your first CSS
5. Make the box look like a card
6. Center the card
7. A soft shadow
8. Color your name
9. Add your links
10. Links in a row
11. Links that react
12. Build it yourself: a card that reacts