Ken Ward's Cascading
Style Sheets Tutorial


See also: HTML Tutorial  JavaScript Tutorial

After you have completed this tutorial, you will be able to read and understand the documentation on style-sheets published elsewhere. You will also have learned how to do the most useful things.

Download a zip of all of Ken's Tutorials (HTML, JavaScript and StyleSheets) for reading on your computer offline - [2.2 MB]

Table of Contents

  1. What's the use of style sheets?
  2. Creating Style-Sheet Files
  3. Selectors
    • Statements, selectors and rules
    • Examples:
      • Background colours
      • Background images
      • Margins
  4. Declarations
    • More examples of background colours
    • Margins, and
    • Padding
  5. Headings and text
    • serif
    • sans-serif
    • monospace
    • cursive
    • fantasy
  6. Alignment
  7. Fonts
  8. Anchors
  9. Class Selectors
  10. Inheritance
  11. Bullets and Lists
  12. More on Selectors
    • Contextual Selectors
      • Example with bulleted list
    • Pseudo Selectors
      • Example of links
    • Pseudo Element Selectors
      • first-letter
      • first-line
  13. Scrollbars
  14. Form Elements
  15. Cursors



These lessons do not always use style sheets. They use inline styles. This is so several points can be illustrated on one page. The code used is usually in this form, using a div element:

<div style="Statements">

Written stuff.


The Statements will often contain a statement about the border, such as:

border: medium #00ff00 solid;

The border is to make the section look like a page!