Style Sheets Guide
=What 'Cascading' Means=
= Index DOT Html by Brian Wilson [bloo@blooberry.com] =

Main Index | Style Sheet Index | Top Of Tree | Tag Index | Tag History



How Style Sheets Cascade
The section on Style Sheet Syntax described the three methods used to specify style information in HTML documents. Mention was also made of levels of distance or "abstraction layers" of styles in the document. In addition to the methods listed, a user may specify their own general style sheet as well. When style information is specified for a single document at more than one of these levels , and is in direct conflict, what should happen? These "cascading" abstraction levels help define how to resolve such conflicts. A document can have styles specified in many locations, but all the information is reduced to a single, cohesive "virtual" Style Sheet. There are, of course, strict rules as to how style information conflicts will be resolved to create this virtual Style Sheet.

General Cascading Order
This is a quick reference to resolving style conflicts. If multiple styles are in conflict, the scales shown below are used to determine which of these styles will be used. A style with higher importance will win over a style with lower importance.
[Note: the last scale mentions "Contextual Selector Quantity" - this refers to the nesting complexity of the tag selector. A simple contextual tag selector (the normal specification method) of 'em' would have a lower importance than a 'h1 em' contextual selector would. This in turn would have a lower importance than a class selector: 'em.test', etc.]
Lowest
Importance		 <================> Highest
Importance
Ownership:Browser
Defaults		 Reader's
Style Sheet		Author's
Style Sheet
Abstraction
Level:		Linked
Style Sheet		 Document Level
Style Sheet		Inline
Styles
Tag
Selector
Specificity:		 Contextual
Selector
Quantity		 CLASSID

Yet More Details: The '!Important' Flag
Style sheet designers can increase the weights of their style assignments using the keyword "!important" This allows the author to change the inherent importance level assigned to the style.
Example:
h1 { color: red ! important }
p { font-size: 12pt ! important }
Note:
- An important reader rule will override an author rule with normal weight.
- An important author rule will override an important reader rule.

Calculating an Exact Cascade Order
There is a much more precise algorithm that browsers should use when determining Cascade Order. It is very complex and probably not of great use to the general reader or author. To find out more about this algorithm, please see the section on Cascading Order in the CSS1 Specification.

Boring Copyright Stuff....