我似乎无法让它工作..我想知道这是否像我想象的那样不可行,或者我现在只是处于大脑煎炸状态..
我有两个 html block ,类分布如下:
<div class="my-class">
<div class="my-class-parent-one">
<div class="my-class-wrapper">
<div class="my-class-child"></div>
<div class="my-class-child"></div>
</div>
</div>
<div>
<div class="my-class">
<div class="my-class-parent-two">
<div class="my-class-wrapper">
<div class="my-class-child"></div>
<div class="my-class-child"></div>
</div>
</div>
<div>
我的 Sass...
.my-class {
&-parent-one &-wrapper &-cell { font-size: 1.15rem; }
&-parent-two &-wrapper &-cell { font-size: 0.85rem; }
}
这不应该等同于:??
.my-class .my-class-parent-one .my-class-wrapper .my-class-child {}
.my-class .my-class-parent-two .my-class-wrapper .my-class-child {}
最佳答案
你的 Sass 将被编译成这样:
.my-class-parent-one .my-class-wrapper .my-class-cell {
font-size: 1.15rem;
}
.my-class-parent-two .my-class-wrapper .my-class-cell {
font-size: 0.85rem;
}
请注意,开头不会有.my-class
选择器。要添加 .my-class
,您需要更改 Sass:
.my-class {
& &-parent-one &-wrapper &-cell { font-size: 1.15rem; }
& &-parent-two &-wrapper &-cell { font-size: 0.85rem; }
}
这里有关于 Sass 中符号的更详细的文本:The Sass Ampersand
关于css - 使用 Sass 的嵌套元素和连接类,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50375195/