initial

概要

プロパティの初期値（仕様書で定義されたデフォルト値）に明示的にリセットするためのキーワードです。例えばdisplayプロパティのinitial値はinlineであり、要素のデフォルトのdisplay値とは異なる場合があります。revert（ブラウザのデフォルトに戻す）との違いを理解することが重要です。

対応ブラウザ

基本構文

.reset {
  display: initial; /* inline */
  margin: initial;  /* 0 */
  color: initial;   /* canvastext */
}

実務での使いどころ

• カスケードされたスタイルのリセット

  親要素や前のルールで設定されたスタイルを仕様上の初期値に戻し、予期しないスタイルの継承を解消します。

注意点

アクセシビリティ

• display: initialでinlineに変更されると、ブロック要素の振る舞いが変わりレイアウトに影響する場合があるため、意図した動作か確認してください。

参考リンク

• MDN Web Docs — initial
• Can I use — initial