計算値

計算値 (computed value) は CSS プロパティにおいて、継承の過程で親から子へと伝えられる値です。これは指定値から計算されます。

  1. 特殊な値である inherit, initial, revert, revert-layer, unset を扱います。
  2. プロパティの概要の「計算値」に記載された値に達するのに必要な計算を行います。

プロパティの計算値に達するのに必要な計算は、一般に (em の単位やパーセントなどの) 相対値を絶対値に変換する計算を含みます。例えば、ある要素に font-size: 16pxpadding-top: 2em が指定された場合、 padding-top の計算値は 32px (フォントサイズの倍) になります。

しかしながら、いくつかのプロパティ (width, margin-right, text-indent, top など、レイアウトの定義に必要ものに対する割合が相対的なもの) でパーセント値で指定された値はパーセント値で計算された値に変わります。さらに、 line-height に指定された単位なしの値は、指定された計算値になります。これらの計算値に残った相対的な値は、使用値が定義された場合、絶対値になります。

メモ: DOM の getComputedStyle() API は解決値を返しますが、これはプロパティによって計算値であるか使用値であるかが変わります。

仕様書

Specification
Cascading Style Sheets Level 2 Revision 2 (CSS 2.2) Specification
# computed-value

関連情報