Home >> Tutorials/FAQs >> CSS Tutorials >> Index

CSS Tutorials - Style Property Inheritance

By: FYICenter.com

(Continued from previous topic...)

What Is Style Property Inheritance?

Style property Inheritance is a rule that allows a style property of a child HTML tag to inherit the same property of the parent HTML tag, if that property is not defined on the child tag. This inheritance rule is very important because a lots of style properties are defined on the parent tags and inherited to the child tags. The CSS below shows you how to define most of the font properties on <P> tags and let <STRONG> and <EM> to inherit them:

<title>CSS Included</title>
<style type="text/css">
  BODY {background-color: black}
  P {font-family: arial; font-size: 12pt; color: yellow}
  STRONG {font-weight: bold}
  EM {font-style: italic}
<p>Welcome to <strong>FYICenter.com</strong>. 
You should see this text in <em>yellow</em> 
on black background.</p>

As you can, the font family, size and color in <STRONG> and <EM> are inherited from <P>.

(Continued on next topic...)

  1. What Is CSS (Cascading Style Sheets)?
  2. What Is the Basic Unit of CSS?
  3. How Many Ways to Attach CSS to HTML Documents?
  4. How To Include CSS Inside an HTML Tag?
  5. How To Include CSS Inside the HEAD Tag?
  6. How To Store CSS Definitions in External Files?
  7. How Many Ways to Select HTML Tag Instances?
  8. What Is a Class Selector?
  9. What Is an ID Selector?
  10. What Is a Contextual Selector?
  11. What Is a Group Selector?
  12. What Is a Mixed Selector?
  13. What Are the Pseudo Classes on <A> Tags?
  14. How To Group CSS Definitions Together?
  15. What Is Style Property Inheritance?
  16. What Is CSS Cascading?
  17. What Are the CSS Cascading Order Rules?
  18. How To Remove the Top White Space of Your Web Page?
  19. How To Set Different Text Fonts Inside Tables?
  20. How To Use Class Selectors to Differentiate Tag Instances?
  21. How To Use IDs to Override Classes?

Selected Developer Jobs: