模拟嵌套选择器而不嵌套它们以与简单选择器结合
模拟嵌套选择器而不嵌套它们以与简单选择器结合
提问于 2016-02-12 23:16:13
说我有这个：
$my-font-size:14px;
p{
font-size:$my-font-size;
}
div.section{
&.type-1,&.type-2{
h1{
font-size:$my-font-size;
}
}
}现在假设我想把它合并成一行。所以我写：
p,div.section.type-1 h1, div.section.type-2 h1{$font-size:$my-font-size;}但是，假设我仍然希望从无需重复“父”( div )的功能中获益。有办法这样做吗？例如：
p,div.section((&.type-1,&.type-2)) h1{$font-size:$my-font-size;}基本上，我在寻找某种速记语法，这样我就可以将它与另一个选择器结合起来。
div.section{
&.type-1,&.type-2{
h1{回答 1
Stack Overflow用户
回答已采纳
发布于 2016-02-12 23:51:16
Sass 3.3或更高版本
您要查找的函数称为selector-append。但是，在您的示例中，还需要将其与selector-nest结合用于h1。
p, #{selector-nest(selector-append('div.section', ('.type-1', '.type-2')), h1)} {font-size:$my-font-size;}Sass 3.2或更高版本
对于较早的Sass版本，您可以使用Compass附带的append-selector函数，但这两个参数都必须是字符串。如前所述，您需要将其与nest函数结合起来，用于h1。
p, #{nest(append-selector('div.section', '.type-1, .type-2'), h1)} {font-size:$my-font-size;}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/35373835
复制相关文章
相似问题
腾讯云开发者
