CSS @Property в декларативном теневом DOM [Duplicate] ⇐ Html

[Гость]

Можно использовать правило css '@property для определения переменных CSS, как в следующем примере (https://codepen.io/sbhmn/pen/pvzmvvx):
>>

Код: Выделить всё

@property --bg-color {
syntax: "*";
inherits: false;
initial-value: #10ded0;
}

div {
background-color: var(--bg-color);
}



Content

Как видите div Получить правильный цвет фона .
Перемещение этого контента в декларативную тень, к сожалению, не работает (переменная CSS остается неопределенной) (https://codepen.io/sbhmn/pen/lepoogw):

Код: Выделить всё

@property --bg-color {
syntax: "*";
inherits: false;
initial-value: #10ded0;
}

div {
background-color: var(--bg-color);
}


Content

Как вы можете видеть в этом случае div не Получите цвет фона, и проверка переменной оставит вас с помощью «--bg-color не определено».
У кого-нибудь есть предложение о том, как решить эту проблему?

Подробнее здесь: https://stackoverflow.com/questions/794 ... shadow-dom