What does "cascading" mean?

"Cascading" means that styles can fall (or cascade) from one style sheet to another, enabling multiple style sheets to be used on one HTML document.

Even the simplest HTML document may have three or more style sheets associated with it including:

 

 

Browser style sheets

Browsers apply style sheets to all web documents. Although these style sheets vary from browser to browser, they all have common characteristics such as black text, blue links, purple visited links etc. These are referred to as a "default" browser stylesheet.

As soon as you, the author, apply a style sheet to a document, it will override the browser's style sheet. This is because author style sheets will always override browser style sheets.

 

 

User style sheets

A user is anyone who looks at your website.

Most modern browsers allow users to set their own style sheets within their browser. These style sheets will override the browsers default style sheets - for that user only.

It is important to know that users can set color and background color for HTML documents. If you, as an author, do not specify a color or background color, a user's style sheet could be used. More importantly, you should either specify both color and background color or neither. If you only specify a color and the user has specified the same color for their background, your entire document may be inaccessible to this user.

 

 

Author style sheets

The author is the person who develops the website - you!

As soon as you apply a basic style sheet or an inline style to a page, you have added what is referred to as an "author style sheet". Everything you do, from choosing fonts, colours and laying out pages in CSS is done using author style sheets.

Author style sheets can be applied inside an HTML document or by linking to an external file. You can also use multiple style sheets on an particular document to take advantage of the cascade.

Generally speaking, author styles override user styles which override browser styles.

 

 

important rules

You can set "!important" on any declaration and this will override other declarations for the same element. "!important" declarations override normal declarations.

For "!important" declarations, user style sheets override author style sheets which override the default style sheet. This allows users with special requirements (large fonts, color combinations, etc.) control over presentation.

 

Use proper, semantic markup.

Using web standards to their fullest is more than valid code. Your markup should make logical sense. Your navigation, for example, is a list of links, and should usually be marked up with and unordered list (<ul><li>item 1</li><li>item 2</li> ... </ul>). Likewise, sections should have headers (<h1> through <h6>), paragraphs should be inside <p> tags, etc.