Web Design in a Nutshell, 3rd Edition

Inheritance

Related to structural relationships is the concept of inheritance, in which most styles are passed down from an element to its descendants. In other words, a child may inherit property values from its parent. For example, if a style rule applies a text color to a ul list, then every list item (li) within that list will be that color as well, because they inherit the property from their parent element. In CSS, most properties are inherited , but some (such as margins and backgrounds) are not. Inheritance is noted in the property descriptions throughout this book.

Styles applied to specific elements override settings higher in the hierarchy. With planning, inheritance can be used to make style specification more efficient. For example, if you’d like all the text on the page to be blue except for list items, you can set the color property at the body level to apply to the whole document and then use another rule to make lis a different color.

This notion of some rules overriding others brings us to an important concept: the cascade .