22/11: Inheritance and Precedence with Cascading Style Sheets (CSS)

Category: General
Posted by: bagheljas
When there is a conflict between CSS and HTML about the display of a specific tag, the CSS will overide HTML. If there is not conflict, than CSS display properties will cascades existing HTML style specifications. The cascading of styles is called inheritance. The content of a tag will inherit properties from HTML element and/or CSS specifications.

The General Order of Precedence: (* the rule listed last takes precedence)
  • Inline Styles
  • Embeded/Linked Styles*
  • Linked/Embedded Styles*
  • In-line HTML
  • HTML Defaults

Other relevant rules of precedence:
  • The rule listed closest to the element takes precedence
  • Child tag take precedence over parent tags


The thoughts expressed in the blog are those of the author and do not represent necessarily the official policy or position of any other agency, organization, employer, or company. Assumptions made in the study are not reflective of the point of view(s) of any entity other than the author. Since we are critically thinking human beings, the point of view(s) is always subject to change, revision and rethinking at any time. While reasonable efforts have been made to obtain accurate information, the author makes no warranty, expressed or implied as to its accuracy.