プロパティの値として unset を指定すると、font-size の様に継承するプロパティの場合は inherit、border の様に継承しないプロパティの場合は initial と同じ動作をします。all を含めたすべてのプロパティで指定可能です。一部の属性だけスタイル設定を外したい場合に利用されます。
| 形式 | 属性名: initial |
|---|---|
| サポート | https://caniuse.com/?search=initial |
類似の値に revert, inherit, unset がありますが、違いについて説明します。下記の状態であると仮定します。
この時、それぞれ下記の様に設定されます。
| initial | 仕様で決められた通常要素の値。16px |
|---|---|
| revert | ブラウザが h1 要素に対して適用している値。32px |
| inherit | 親要素に設定している値。14px |
| unset | font-size のように継承するプロパティの場合は inherit と同じ。 border-color のように継承しないプロパティの場合は initial と同じ。 |
下記の例では、親要素(parent)で、色、太字、サイズを指定しています。子要素A(childA)ではすべての属性をリセットしています。子要素B(childB)でもすべての属性をリセットしていますが、色だけは親要素の値を継承しています。
.parent {
color: red;
font-weight: bold;
font-size: 16pt;
}
.childA {
all: initial;
}
.childB {
all: initial;
color: unset;
}
<div class="parent"> parent <div class="childA">childA</div> <div class="childB">childB</div> </div>