Controlling inheritance
CSS provides five special universal property values for controlling inheritance. Every CSS property accepts these values.
inherit
initial
revert
revert-layer
unset
revert
The revert
keyword works exactly the same as unset
(opens in a new tab) in many cases. The only difference is for properties that have values set by the browser or by custom stylesheets created by users (set on the browser side).
The revert
keyword is different from and should not be confused with the initial
(opens in a new tab) keyword, which uses the initial value (opens in a new tab) defined on a per-property basis by the CSS specifications. In contrast, user-agent stylesheets set default values on the basis of CSS selectors.
For example, the initial value (opens in a new tab) for the display
property is inline
, whereas a normal user-agent stylesheet sets the default display
value of <div>
s to block
, of <table>
s to table
, etc.
unset
The unset
CSS keyword resets a property to its inherited value if the property naturally inherits from its parent, and to its initial value (opens in a new tab) if not. In other words, it behaves like the inherit
(opens in a new tab) keyword in the first case, when the property is an inherited property (opens in a new tab), and like the initial
(opens in a new tab) keyword in the second case, when the property is a non-inherited property (opens in a new tab).