什么不是用这个Mixin编译？

Question

下面的mixin没有编译成CSS，我找不出原因。它不会给出任何错误。

CSS输出是here：

@mixin calc-height($element, $percentage, $pixels) { 
    $element: -moz-calc(#{$percentage} - #{$pixels}); 
    $element: -webkit-calc(#{$percentage} - #{$pixels}); 
    $element: -o-calc(#{$percentage} - #{$pixels}); 
    $element: calc(#{$percentage} - #{$pixels}); 
} 

.white-triangle { 
    width: 0; height: 0; 
    border-top: 30px solid transparent; 
    border-bottom: 30px solid transparent; 
    border-right: 20px solid white; 
    position: absolute; 
    @include calc-height("top", "50%", "15px"); 
} 

Answer 1

哦，我想通了。你只需要像这样调用元素变量：

@mixin calc-height($element, $percentage, $pixels) { 
    #{$element}: -moz-calc(#{$percentage} - #{$pixels}); 
    #{$element}: -webkit-calc(#{$percentage} - #{$pixels}); 
    #{$element}: -o-calc(#{$percentage} - #{$pixels}); 
    #{$element}: calc(#{$percentage} - #{$pixels}); 
}