Все четыре значения color некорректны: 0red, 0blue, 0yellow и 0magenta не являются цветами CSS. Эти декларации игнорируются, а цвет наследуется или берётся из стилей браузера.
Какой цвет текста получит div‑элемент и почему это происходит
Все четыре значения color некорректны: 0red, 0blue, 0yellow и 0magenta не являются цветами CSS. Эти декларации игнорируются, а цвет наследуется или берётся из стилей браузера.
Короткий ответ
Что ответить на собеседовании
Подробный разбор
Ответ с пояснениями
Условие
Необходимо определить, какой цвет будет применён к тексту внутри элемента <div> и объяснить, почему выбран именно этот цвет.
<html>
<head>
<style>
#element {
color: 0red;
}
.element {
color: 0blue;
}
div.element {
color: 0yellow;
}
div.element {
color: 0magenta;
}
</style>
</head>
<body>
<div id="element" class="element">
Some dummy text
</div>
</body>
</html>
Ответ
Все четыре значения color некорректны: 0red, 0blue, 0yellow и 0magenta не являются цветами CSS. Эти декларации игнорируются, а цвет наследуется или берётся из стилей браузера.
Поэтому нельзя выбрать красный только по специфичности #element. Каскад сравнивает применимые валидные декларации; ошибочное значение не участвует в выборе. Если удалить начальные нули, победит #element { color: red; }, потому что ID-селектор специфичнее классов и селектора тега с классом. При отсутствии ID-правила из двух одинаковых div.element победило бы более позднее magenta.