Inheritance
๐ SitePoint โฉ CSS Inheritance: An Introduction
inherit
inheritance flows down the DOM tree.
use
inherit
to make inheritance take precedence over the cascaded value.use
inherit
to force inheritance of a property not normally inherited, such as border or padding. ๐See: border-box fix
intial
Every CSS property has an initial (default) value. If you assign
initial
to that property, then it resets to its default value.remove a border:
border: initial
restore default width:
width: initial
property
default value
note
width
auto
display
inline
examples
/* global link color */
a:link { color: blue; }
/* parent */
.footer {
color: #666;
background-color: #ccc;
padding: 15px 0;
text-align: center;
font-size: 14px;
}
/* child */
.footer a {
color: inherit; /* inherit from parent: #666 */
text-decoration: underline;
}
inherited properties
references
Last updated
Was this helpful?