有没有一种方法可以将伪类添加到嵌套子元素的父元素中。 仅使用 CSS
示例:在 .less 文件中,这就是我所拥有的。
.collection {
// Some styling
.headingRow {
//Some styling
.heading{
//Some styling
// This is where i want it to add the styling for alternate .collection class
}
}
}
这就是我想要的输出
.collection:nth-of-type(2n+1) .headingRow .heading
{
background-color: #7a003d;
}
.collection:nth-of-type(2n) .headingRow .heading
{
background-color: #322f31;
}
这是我尝试过的 - 从 .heading 类添加 &
,我可以使用类似
.collection {
// Some styling
.headingRow {
//Some styling
.heading{
div&
// This results in div.collection .headingRow .heading { }
}
}
}
有没有办法可以将伪类添加到父祖先?
最佳答案
像这样:
.collection {
// ...
.headingRow {
// ...
}
}
.headingRow .heading {
.collection
& {background-color: red}
.collection:nth-of-type(2n)
& {background-color: blue}
.collection:nth-of-type(2n + 1)
& {background-color: green}
}
虽然我不认为它比没有任何嵌套的普通旧 CSS 定义更好。
关于css - 在less中将伪类添加到父祖先(选择器),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23299347/