document.documentElement.style.setProperty ('- some-color', 'green') не работает в IE

Question

У меня есть пользовательская переменная CSS, объявленная в отдельном файле CSS в селекторе.

.ui-grid-row:nth-child(odd) {
background-color: var(--altbg-color) !important;
}

Это не корневой элемент.Так что не уверен, как css-vars-ponyfill будет работать в этом случае.Я тоже попробовал, но не смог заставить его работать(Я был бы признателен, если кто-нибудь может помочь мне заставить его работать.)

Я пытаюсь установить значение переменной через javascript (я использую AngularJS 1.3), используя

document.documentElement.style.setProperty('--some-color', 'green')

, которыйотлично работает с Chrome и Firefox, но не в IE (11).

У кого-нибудь есть решение?

Заранее спасибо.

Answer 1

Это не поддерживается в IE 11 .

Вы можете использовать только переменные CSS из IE edge 16 и выше. Тем не менее, он частично поддерживается в IE 15.

• В Edge 15 вложенные вычисления с переменными css не вычисляются и игнорируются см. Ошибку
• В Edge 15 анимация с переменными css может привести к сбою веб-страницы см. Ошибку
• В Edge 15 невозможно использовать переменные css в псевдоэлементах см. Ошибку

Хотя для этого есть полифилл:

https://www.npmjs.com/package/css-vars-ponyfill

Это не поддерживает IE edge 11. Он начинает поддерживать IE edge 12+. И без края, он начинает поддерживать с IE 9.

IE  Edge    Chrome  Firefox Safari
----------------------------------
9+  12+     19+     6+      6+