initial

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since November 2015.

initial は CSS のキーワードで、要素にプロパティの初期値(または既定値)を設定します。どの CSS プロパティにも適用できます。これは、 CSS の一括指定プロパティ all を 含め、すべての CSS プロパティに適用することができます。 allinitial に設定すると、すべての CSS プロパティをそれぞれの初期値に戻すことができます。

継承プロパティでは、初期値は予期せぬ値になるかもしれません。代わりに inherit, unset, revert, revert-layer キーワードを使用することを検討してください。

initial を使用して要素の色を初期化

HTML

html
<p>
  <span>このテキストは赤です。</span>
  <em>このテキストは初期値(ふつうは黒)です。</em>
  <span>これは再び赤です。</span>
</p>

CSS

css
p {
  color: red;
}

em {
  color: initial;
}

結果

この例では initial キーワードにより、em 要素の color 値は、仕様書で定義されている color の初期値に戻されます。

仕様書

Specification
CSS Cascading and Inheritance Level 4
# initial

ブラウザーの互換性

BCD tables only load in the browser

関連情報

  • inherit キーワードを使用すると、要素のプロパティを親と同じ値にします。
  • revert キーワードを使用すると、プロパティをユーザーエージェントのスタイルシート(またはもしあれば、ユーザーのスタイル)で設定された値に初期化します。
  • revert-layer キーワードを使用すると、プロパティを直前のカスケードレイヤーで確立された値に戻します。
  • unset キーワードを使用すると、継承プロパティは継承値に、それ以外は初期値に設定します。
  • all プロパティは、すべてのプロパティを一度に initial, inherit, revert, unset の状態にします。