在Sass中將變量設置爲@mixin？

Question

有沒有辦法將@include mixin();設置爲變量？ 我想這

@mixin bg-gradient($fallback, $type, $positionX, $positionY, $from, $from-percent, $to, $to-percent){ 
    background: $fallback; 
    background: -webkit-#{$type}-gradient($positionX $positionY, $from $from-percent, $to $to-percent); 
    background: -moz-#{$type}-gradient($positionX $positionY, $from $from-percent, $to $to-percent); 
    background:   #{$type}-gradient($positionX $positionY, $from $from-percent, $to $to-percent); 
} 

$navBg: @include bg-gradient(#eee, radial, top, center, #999, 0%, #555, 100%); 
body { $navBg; } // it gave me an error 

Answer 1

我不知道有什麼方法可以做到這一點特別，但如果你想只幹上特定類型的梯度設置，你可以爲它編寫的包裝混入：

@mixin navBg() { 
    @include bg-gradient(#eee, radial, top, center, #999, 0%, #555, 100%); 
} 
body { @include navBg; } 

編輯：

Here「由上海社會科學院變量支持的數據類型的SA列表。包括mixin調用，也不包括它們的結果（整個CSS規則）。我也嘗試將include作爲一個字符串並對其進行插值，但這隻適用於最終結果CSS，而不適用於其他指令。

Answer 2

@mixin gradient ($place, $bcolor1, $bcolor2){`<br>` 
    background-image: linear-gradient($place, $bcolor1, $bcolor2)`<br>` 
    background-image: -o-linear-gradient($place, $bcolor1, $bcolor2)`<br>` 
    background-image: -moz-linear-gradient($place, $bcolor1, $bcolor2)`<br>` 
    background-image: -webkit-linear-gradient($place, $bcolor1, $bcolor2)`<br>` 
    background-image: -ms-linear-gradient($place, $bcolor1, $bcolor2)`<br>` 
} 

body{ 
    @include gradient(bottom, #F90000 18%, #FF4C4C 66%) 
} 

Answer 3

如果您嘗試將返回值設置爲SASS變量，則需要使用@function而不是@mixin。這讓我停了一會兒，並沒有意識到@功能。例如...

@function font($font-size, $line-height: 1.4, $font-family: Arial) { 

    @if $line-height == 1.4 { 
     $line-height: round($line-height*$font-size); 
    } 

    @return #{$font-size}/#{$line-height} $font-family; 
} 

$font-medium: font(20px); 

順便說一句，雖然這並沒有解決一下這個用戶正在尋找準確，這是關於在一個互聯網搜索彈出約VAR設置爲混入的唯一的事情，所以我如果這種情況出現，我們希望在這裏與其他人分享。