HTML and CSS Reference
In-Depth Information
Would the contents of the <strong> tag enclosed in the <p> tag also be red? The answer is
yes, because the color is inherited from the parent element:
p {color:red;}
Whereas most elements can inherit the style features of their parents, some style properties
do not inherit. For example, consider setting the border property of the paragraph like so:
p {border: solid;}
If the enclosed <strong> tag from the previous example inherited the border, you would
expect to see something like this:
This is a test
However, this does not happen; the border is limited just to the paragraph itself because the
border value is not inherited. The reference in Chapter 5 will point out important non-
inheriting properties.
Assuming that a property does inherit, it is still possible to override the inheritance of
a property. For example, consider the following two rules:
p {color: red; font-size: xx-large;}
strong {color: yellow;}
In this case, the color of the text within the <strong> tag would be yellow and have an xx-
large size. Both of the properties were inherited, but the color property was overridden
by the color rule for the <strong> tag, which is more specific:
p {color:red; font-size: xx-large}
strong {color: yellow;}
Red, xx-large
Override Inherit
Yellow, xx-large
Search WWH ::

Custom Search