CSS Inheritance Automatic inheritance
Example
Inheritance the a fundamental mechanism of CSS by which the computed values of some properties of an element are applied to its' children. This is particularly useful when you want to set a global style to your elements rather than having to set said properties to each and every element in your markup.
Common properties that are automatically inherited are: font, color, text-align, line-height.
Assume the following stylesheet:
#myContainer {
color: red;
padding: 5px;
}
This will apply color: red not only to the <div> element but also to the <h3> and <p> elements. However, due to the nature of padding its value will not be inherited to those elements.
<div id="myContainer">
<h3>Some header</h3>
<p>Some paragraph</p>
</div>
