Sass 中的多个两类选择器

对单个声明块使用多个两类选择器，是否可以简化以下操作(即不必重复 body标记) :

body.shop, body.contact, body.about, body.faq {background-color:#fff;}

85056 次浏览

小开

最佳答案

试试这个:

body{
&.shop, &.contact, &.about, &.faq {
background-color:#fff;
}
}

小开

body {
&.shop, &.contact {
// Styles here...
}
}

小开

在这种情况下，我们可以使用 @each指令:

$pages: shop, contact, about, faq;


body {
@each $page in $pages {
&.#{$page} {
background-color:#FFF;
}
}
}

小开

如果您使用的是由节点编译的 sass，则可以这样做。

    body {
.shop, .contact, .about, .faq {
background-color:#FFFFFF;
}
}

小开

顶嘴中的亲子关系

parent_tag {
.child {
// rules here
}
}