[英]Nested selectors using Sass
How can I have this output using Sass?我怎样才能使用 Sass 获得这个 output?
.class.active .class-name1 {}
.class.active .class-name2 {}
Here is what I tried:这是我尝试过的:
.class {
&.avtive {
&-name1 {
}
&-name2 {
}
}
}
You need to keep a reference to the outer class name, and interpolate it for your -name
classes.您需要保留对外部 class 名称的引用,并将其插入到您的-name
类中。 Using color: red
as an example of the style to apply:使用color: red
作为要应用的样式的示例:
.class {
$outer-class: &;
&.active {
#{$outer-class}-name1 {
color: red;
}
#{$outer-class}-name2 {
color: red;
}
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.