<分区>
<分区>
我想为 <a> 嵌套选择器类内的标签 .class-name ，以便仅将这些样式应用于同时具有 <a> 的元素标签和类 .class-name使用 SCSS。我想做的可以通过以下方式执行:
.class-name {
font-size: 40px;
}
a.class-name {
color: #ff6666;
}<div class="class-name">Hello</div>
<a class="class-name" href="#">World!</a>我在 SCSS 中使用 & 尝试了两种不同的方式父选择器
# successfully transpiled but no change
.class-name {
font-size: 40px;
&a {
color: #ff6666;
}
}
# Got an error trying to transpile
.class-name {
font-size: 40px;
a& {
color: #ff6666;
}
}
我不想以相反的方式嵌套(.class-name 在a 内)。
最佳答案
我认为你必须使用 Sass' @-root .
.class-name {
font-size: 40px;
@at-root {
a#{&} {
color: #ff6666;
}
}
}
我个人觉得它读起来不是很愉快，更重要的是很难通过 ctrl+f 在文件中找到(如果你没有源映射)
编辑:如果整个 block 嵌套到其他东西中，将会中断......
关于css - 在 SCSS 中将标签名称嵌套到类样式中，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/47673111/