CSS Cascade

SQL     Data Warehousing     CSS     PHP     HTML     Database Normalization


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 © 2014   1keydata.com   All Rights Reserved   Privacy Policy   About   Contact