Skip to content

Exercises (CSS): Webmaking with HTML and CSS

Jump to bottom
Jonathan edited this page Jun 19, 2023 · 5 revisions

CSS exercises

Exercise 5: background-color 

selector { property: value; }

Instructions

Let's write some CSS rules to change the background color of some of our elements! First, create a style element (<style>...</style>) inside your head element. Then:

  1. Set the header element's background-color to mediumvioletred.
  2. Set the background-color of your section elements to lightgrey.
  3. Set the background-color of your main element to goldenrod.

Hints

  • Follow the CSS syntax pattern: selector { property: value; }. For task 1, this means: use header as the selector, background-color as the property and mediumvioletred as the value.

Code snippets
  • Adding a style element and the solution for task 1 (the other tasks follow this pattern).
<!DOCTYPE html>
<html>
  <head>
    <style>
      header { background-color: mediumvioletred; }
    </style>
  </head>
  <body>
    <!-- body content -->
  </body>
</html>

Clone this wiki locally