From 38d85a0fd28c3123743acfb046e1f1aaaaf15641 Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Sun, 2 Jan 2022 23:11:09 +0900 Subject: 2021/08/13 時点の英語版に同期 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- files/ja/web/css/computed_value/index.md | 73 +++++++++++++++----------------- 1 file changed, 34 insertions(+), 39 deletions(-) (limited to 'files/ja/web') diff --git a/files/ja/web/css/computed_value/index.md b/files/ja/web/css/computed_value/index.md index f08509b8d0..c5848e0bf4 100644 --- a/files/ja/web/css/computed_value/index.md +++ b/files/ja/web/css/computed_value/index.md @@ -3,57 +3,52 @@ title: 計算値 slug: Web/CSS/computed_value tags: - CSS - - Guide - - Reference + - ガイド - リファレンス translation_of: Web/CSS/computed_value --- -
{{cssref}}
+{{CSSRef}} -

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

+**計算値** (computed value) は [CSS](/ja/docs/Web/CSS) プロパティにおいて、継承の過程で親から子へと伝えられる値です。これは[指定値](/ja/docs/Web/CSS/specified_value)から計算されます。 -
    -
  1. 特殊な値である {{cssxref("inherit")}}, {{cssxref("initial")}}, {{cssxref("unset")}}, {{cssxref("revert")}} を扱います。
    2. -
  2. プロパティの概要の「計算値」に記載された値に達するのに必要な計算を行います。
    3. -
+1. 特殊な値である {{cssxref("inherit")}}, {{cssxref("initial")}}, {{cssxref("unset")}}, {{cssxref("revert")}} を扱います。 +2. プロパティの概要の「計算値」に記載された値に達するのに必要な計算を行います。 -

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

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

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

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

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

-
+> **Note:** DOM の {{domxref("Window.getComputedStyle", "getComputedStyle()")}} API は[解決値](/ja/docs/Web/CSS/resolved_value)を返しますが、これはプロパティによって[計算値](/ja/docs/Web/CSS/computed_value)であるか[使用値](/ja/docs/Web/CSS/used_value)であるかが変わります。

仕様書

- - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName("CSS2.2", "cascade.html#computed-value", "computed-value")}}{{Spec2("CSS2.2")}} -

変更なし

-
{{SpecName("CSS2.1", "cascade.html#computed-value", "computed value")}}{{Spec2("CSS2.1")}}初回定義
仕様書状態備考
+ {{SpecName("CSS2.2", "cascade.html#computed-value", "computed-value")}} + {{Spec2("CSS2.2")}}変更なし
+ {{SpecName("CSS2.1", "cascade.html#computed-value", "computed value")}} + {{Spec2("CSS2.1")}}初回定義
-

関連情報

+## 関連情報 - +- {{domxref("window.getComputedStyle")}} +- {{CSS_key_concepts}} -- cgit v1.2.3-54-g00ecf