Можно ли использовать CSS-переменные в селекторах CSS3?
Я пытаюсь провести некоторые эксперименты с CSS-переменными, и я не могу заставить это работать или найти какую-либо документацию по этому поводу. Кто-нибудь знает, возможно ли использовать CSS-переменную в селекторе CSS3?
Я сделал следующий пример, чтобы объяснить, что я пытаюсь сделать.Этот пример только Chrome.
JSFIDDLECSS:root {
-webkit-var-count: 5; /* define my var! */
}
li {
width:100px;
height:100px;
background-color:blue;
display:inline-block;
list-style:none;
}
ul li:nth-child(4) {
background-color:red;
}
ul li:nth-child(-webkit-var(count)) { /* I can't get this working, is it even supported? I'm trying to target the 5th element with my var. */
background-color:black;
}
HTML<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>