2023-07-06 CSS initial/inherit/unset の違い
Chat GPT に聞いてみた。以下、ChatGPTの回答よりまとめる。
- initial: プロパティをそのデフォルト値にリセットする。たとえば、
color: initial;
は、color
プロパティをそのデフォルト値であるblack
に設定する - inherit: プロパティを親要素から継承する。たとえば、子要素に
color: inherit;
を設定すると、その親要素のcolor
値が使用される - unset: プロパティをリセットし、そのプロパティが継承可能な場合は
inherit
を、それ以外の場合はinitial
を適用する。たとえば、color
プロパティは継承可能なので、color: unset;
はcolor: inherit;
と同じ動作になる。一方、margin
プロパティは継承可能ではないので、margin: unset;
はmargin: initial;
と同じ動作になる。