The Inherit Value

Contact Us or call 1-877-932-8228
The Inherit Value

The Inherit Value

Many properties take the value inherit. This specifies that the property value should be inherited from the parent element. If such a property is left undefined, the implicit value is inherit.

To illustrate, look at the following:

Code Sample:

CrashCourse/Demos/inherit.html
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Inherit</title>
<style>
p {
	font-style: none;
}

em {
	font-style: inherit;
	text-decoration: underline;
}
</style>
</head>
<body>
<p>Even the word <em>inherit</em> isn't italicized.</p>
</body>
</html>

The rule for p sets the font-style of paragraphs to none, which means plain, non-italicized text. We don't really have to do this as the default value for font-style for paragraphs is none.

The rule for em sets the font-style for emphasized text, which is usually italic, to inherit. That means that, in the HTML below the CSS, the em tag will inherit the none value from the containing p tag. We also set the text-decoration property to underline, so we can still see that the tag's content is emphasized:The inherit tag.

Next