CSS Inheritance
How properties trickle down from parents to children.
1Inherited Properties
Properties like color and font-family are inherited by child elements unless overridden.
body {
color: blue;
font-family: sans-serif;
}
/* p will be blue and sans-serif */
p { }2Understand it in a real interface
Some properties, including many text-related properties, normally inherit from an ancestor. Other properties, such as padding and borders, generally need their own declarations. An inherited value can be overridden by a declaration that applies directly to the descendant; inheritance is not the same as a selector matching that descendant.
3Try it yourself
Set color and padding on a container with two paragraphs. Observe that text color is inherited but padding is not copied onto each paragraph. Add a class to one paragraph and give it a different color. Use developer tools to find the source of each value.
Finished reading?
Mark this topic as complete to track progress.