动态：最后一个孩子在SASS

Question

我一直在搞SASS一段时间，并做了一些很好的功能，使@if @else如果等等。但是我有以下两段代码在Mixin ：

&:last-child { float: right; margin-right: 0; } 
&:only-child { float: left; margin-right: 0; } 

这显然将这两段代码应用到我包含此特定Mixin的每个元素上。有没有一种方法来动态检查一个元素是否是：last-child /：only：具有@if语句的子元素或其他方法？

喜欢的东西：

@if :last-child == True { float: right; margin-right:0; } 

希望我已经解释得很清楚。

谢谢

Answer 1

Sass对您的文档一无所知。它不能检查元素是第一个孩子还是独生子。 Sass只能用于生成有效的CSS。

如果你正在寻找的最后一个孩子是不是独生子女，这是你的选择：

&:last-child:not(:only-child) { 
    // styles 
} 

http://tinker.io/1717b

如果你想关闭一个或输出另一个（因为你已经知道在这种情况下只有其中一个适用），那么你需要一个额外的参数传递给你的mixin：

@mixin foo($children: true) { 
    @if $children or $children == last-child { 
    &:last-child { 
     // styles 
    } 
    } 
    @if $children or $children == only-child { 
    &:only-child { 
     // styles 
    } 
    } 
}