В чем разница между начальными и неустановленными значениями?
Простой пример:
HTML
<p style="color:red!important">
this text is red
<em>
this text is in the initial color (e.g. black)
</em>
this is red again
</p>
CSS
em {
color:initial;
color:unset;
}
В чем разница между initial
и unset
? Поддерживает только браузеры
CanIUse: неустановленное значение CSS
Разработчик Mozilla Web CSS Initial
Ответы
Ответ 1
По вашей ссылке:
unset
- это значение CSS, такое же, как "наследовать", если свойство наследуется, или "начальное", если свойство не наследуется.
Вот пример:
pre {
color: #f00;
}
.initial {
color: initial;
}
.unset {
color: unset;
}
<pre>
<span>This text is red because it is inherited.</span>
<span class="initial">[color: initial]: This text is the initial color (black, the browser default).</span>
<span class="unset">[color: unset]: This text is red because it is unset (which means that it is the same as inherited).</span>
</pre>
Ответ 2
Я хотел бы привести официальную документацию CSS | MDN для дальнейшего использования при изучении различий между ними:
INITIAL
Исходное ключевое слово CSS применяет начальное значение свойства к элементу. Это разрешено для каждого свойства CSS и вызывает элемент, для которого указано, чтобы использовать начальное значение свойства.
Поэтому в соответствии с вашим примером:
em {
color:initial;
/* color:unset; */
}
<p style="color:red!important">
this text is red
<em>
this text is in the initial color (e.g. black)
</em>
this is red again
</p>