如何用逗号为多个值在sass中创建一个通用的@mixin,用户现在可能不知道每个包含mixin会有多少个值?
用户可能希望在某些情况下放置一个阴影,并且可能是具有不同css样式的5个阴影,并且具有不同的值.
什么是最好的方法或我们有选择吗?
text-shadow: 0 0 5pt white,0 0 6pt white,0 0 7pt white,0 0 8pt white,0 0 9pt white,0 0 10pt white,0 0 11pt white,0 0 12pt white,0 0 13pt white,0 0 14pt white,0 0 15pt white,0 0 16pt white,0 0 17pt white,0 0 18pt white,0 0 19pt white;
我需要这样的东西:
@mixin textShadow($h-shadow:$baseUnit * 0,$v-shadow:$baseUnit * 0,$blur:$baseUnit * 2,$color:white)
解决方法
从
official documentation:
Sass supports “variable arguments,” which are arguments at the end of a mixin declaration that take all leftover arguments and package them up as a list. These arguments look just like normal arguments,but are followed by
...
. For example:
@mixin Box-shadow($shadows...) { -moz-Box-shadow: $shadows; -webkit-Box-shadow: $shadows; Box-shadow: $shadows; } .shadows { @include Box-shadow(0px 4px 5px #666,2px 6px 10px #999); }