The computed value of a CSS property is the value that is transferred from parent to child during inheritance. It is calculated from the specified value by:
inherit
, initial
, unset
, and revert
.The computation needed to reach a property's computed value typically involves converting relative values (such as those in em
units or percentages) to absolute values. For example, if an element has specified values font-size: 16px
and padding-top: 2em
, then the computed value of padding-top
is 32px
(double the font size).
However, for some properties (those where percentages are relative to something that may require layout to determine, such as width
, margin-right
, text-indent
, and top
), percentage-specified values turn into percentage-computed values. Additionally, unitless numbers specified on the line-height
property become the computed value, as specified. The relative values that remain in the computed value become absolute when the used value is determined.
Note: The getComputedStyle()
DOM API returns the resolved value, which may either be the computed value or the used value, depending on the property.
Specification | Status | Comment |
---|---|---|
CSS Level 2 (Revision 1) The definition of 'computed value' in that specification. | Recommendation | Initial definition. |
window.getComputedStyle
© 2005–2018 Mozilla Developer Network and individual contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/CSS/computed_value