Lesson 6

CSS

Designing your HTML

CSS is the language of style and design, and stands for Cascading Style Sheets. CSS allows you to specify how you want your HTML elements to look.

CSS is built up of three parts: the selector, or the element you wish to style (body, h1, p etc.); the style properties of a given element (font-size, text-align etc.); and lastly the different values of these properties (14px, blue, center etc.). We wrap the properties in curly brackets so the browser knows when the style properties start and end for the selector. That's CSS in a nutshell. All of CSS is based of these three concepts.

element {
property: value;
property: value;
}

Play
Go to the next lesson

index.html

style.css

the web page

New Window

Tasks

  • Change the page background-color
  • Changing the overall font-family
  • Increase the font-size of h1
  • Give the p a shadow by adding the property and value: text-shadow: 1px 1px #ccc;
  • Remove the underline in hyperlink by adding the property and value: text-decoration: none;
Next Lesson
Practical understanding of CSS selectors, properties and values, and how CSS ties into HTML Badge

Basic CSS Concept

Congratulations! You’ve just earned the Basic CSS Concept badge!

If you'd like to send this badge to your Mozilla backpack, just fill out the form below.

This will push your badge to the Mozilla Badge Backpack which is governed by the Mozilla Badge Backpack Terms of Use and Privacy Policy.