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「SASS変数によってサポートされるデータ型のSAリスト。 mixinの呼び出しやその結果（CSSルール全体）は含まれません。また、インクルードを文字列として扱い、補間しようとしましたが、それは最終的な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変数に設定しようとする場合は、@関数を使用する必要がありますが、@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の設定に関するインターネット検索にポップアップする唯一の事についてですこの状況が発生した場合、他の人が何をすべきか知るためにここでこれを共有したいと考えました。