此SASS代码...
@mixin test
{
@at-root #{selector-replace(&, '.class1', '.class1:nth-child(odd)')}
{
color:red;
}
}
.class1
{
.class2
{
@include test;
}
}
...编译为：
.class1:nth-child(odd) .class2
{
color: red;
}
不使用选择器替换时是否可能（因为我不知道class1的调用方式）？
我只想向祖父母添加第n个子选择器。
我只允许更改mixin，而不是原始代码。
好的，这可以解决问题：
@mixin test
{
// Find the first selector
$parent : nth(nth(&, 1), 1);
// Defines a list for the rest of the selectors
$rest : ();
// For each selector of &, starting from the second
@for $i from 2 through length(nth(&, 1)) {
// Adds the selector to the list of the "rest of the selectors"
$rest: append($rest, nth(nth(&, 1), $i));
}
// Adds the selector at root
@at-root #{$parent}:nth-child(odd) #{$rest} {
color: red;
}
}
.class1
{
.class2
{
@include test;
}
}
编译为：
.class1:nth-child(odd) .class2 {
color: red;
}
希望能帮助到你！
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句