如何在SCSS中使用和号来将父选择器作为后缀进行重用?
我之前使用的是LESS CSS,现在正在使用SCSS做我的第一个项目。在LESS中,我可以使用和号&
在选择器的任何位置引用父选择器。但是在SCSS中,我感觉这个操作符有些怪异。
示例:
.grid {
/* grid styles */
ul& {
/* grid styles if this class was set to an UL element */
}
}
在LESS CSS中,这将编译为以下内容,这正是我在大多数情况下所需要的:
.grid {
/* grid styles */
}
ul.grid {
/* grid styles if this class was set to an UL element */
}
但在SCSS中,这会引发异常。 SCSS中还有另一种符号,看起来像这样:
.grid {
/* grid styles */
ul#{&} {
/* using SCSS escaping syntax*/
}
}
但这又给我带来了意外的结果:
.grid {
/* grid styles */
}
.grid ul.grid {
/* Uh SCCS, what happened now? */
}
在SCSS中,是否有一种方法可以在父选择器不是选择器的第一部分时重用它?
ul &
可以工作,但会产生完全不同的选择器... - feeela