How can I have this output using Sass?
.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. Using color: red
as an example of the style to apply:
.class {
$outer-class: &;
&.active {
#{$outer-class}-name1 {
color: red;
}
#{$outer-class}-name2 {
color: red;
}
}
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.