CSS Cascade


CSS Tutorial  >  Cascade

CSS stands for Cascading Style Sheets. If there is only one stylesheet, the "cascade" part does not come into play. The concept of cascade becomes important when multiple stylesheets are specified for an HTML document.

Cascade refers to the rules to determine which property gets applied when a property is declared multiple times in the different style sheets.

The general rule of thumb is that, the closer a style is to the actual HTML element, the higher priority it gets. So, inline styles will usually get the highest priority, because they are the closest to the actual HTML element. The next highest in priority is the embedded stylesheets, those declared inside the <head> tag. Following that is the imported stylesheet, which those imported last getting the highest priority. Finally, we have the linked stylesheet. When multiple style sheets are linked, those linked later will get higher priorities.

We should also mention that each browser also have its own stylesheet (that's where the blue links came from -- links are blue because that's browser's default style). These receive the lowest priority.

So, the priority list, from the highest priority to the lowest priority, is as follows:

  • Inline stylesheet
  • Embedded stylesheet
  • Imported stylesheet
  • Linked stylesheet
  • Browser's own stylesheet

Next: CSS Inheritance





Copyright 1keydata.com 2007, 2008, All Rights Reserved.   Privacy Policy



CSS Tutorial
CSS Syntax
Apply CSS
CSS Media Types
CSS Cascade
CSS Inheritance
CSS Class ID
CSS Div Span
CSS Length Units

CSS Box Model
CSS Margin
CSS Border
CSS Padding
CSS Background
CSS Color
CSS Font
CSS Link
CSS List
CSS Table
CSS Position
CSS Text
CSS Float
CSS Clear
CSS Cursor

CSS Codes

Resources