Css 在Sass中将变量设置为@mixin?
有没有办法设置Css 在Sass中将变量设置为@mixin?,css,variables,sass,mixins,Css,Variables,Sass,Mixins,有没有办法设置@include mixin()到变量? 我试过这个 @mixin bg gradient($fallback、$type、$positionX、$positionY、$from、$from.%、$to、$to.%){ 背景:后备; 背景:-webkit-#{$type}-渐变($positionX$positionY,$from%$到$to%$); 背景:-moz-#{$type}-gradient($positionX$positionY,$from-percent,$to-p
@include mixin()代码>到变量?
我试过这个
@mixin bg gradient($fallback、$type、$positionX、$positionY、$from、$from.%、$to、$to.%){
背景:后备;
背景:-webkit-#{$type}-渐变($positionX$positionY,$from%$到$to%$);
背景:-moz-#{$type}-gradient($positionX$positionY,$from-percent,$to-percent);
背景:#{$type}-gradient($positionX$positionY,$from%$到$to%$);
}
$navBg:@包括bg梯度(#eee、径向、顶部、中心、#999、0%、#555、100%);
body{$navBg;}//它给了我一个错误
我不知道有什么特别的方法可以做到这一点,但是如果你想在特定类型的渐变上晾干你的设置,你可以为它编写一个包装器:
@mixin navBg() {
@include bg-gradient(#eee, radial, top, center, #999, 0%, #555, 100%);
}
body { @include navBg; }
编辑:
是SASS变量支持的数据类型列表。既不包括mixin调用,也不包括它们的结果(整个CSS规则)。我还尝试将include作为字符串处理并插入它,但这只适用于最终结果CSS,而不适用于进一步的指令。@mixin gradient($place,$bcolor1,$bcolor2){`
`
@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%)
}
背景图像:线性渐变($place,$bcolor1,$bcolor2)`
`
背景图像:-o-线性梯度($place,$bcolor1,$bcolor2)`
`
背景图像:-moz线性渐变($place,$bcolor1,$bcolor2)`
`
背景图片:-webkit线性渐变($place,$bcolor1,$bcolor2)`
`
背景图像:-ms线性渐变($place,$bcolor1,$bcolor2)`
`
}
身体{
@包括坡度(底部,#F90000 18%,#FF4C 66%)
}
如果试图将返回值设置为SASS变量,则需要使用@function,而不是@mixin。这让我挂断了一会儿,我没有意识到@function。例如
@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设置为mixin的唯一内容,所以我想在这里与其他人分享,让他们知道如果出现这种情况,该怎么办。Thnx了解解决方案和其他信息!我真的很感激这对OP的用例没有帮助,因为他们不需要一个单一的返回值。你为什么要用硬编码的值创建一个函数
?有点违背了这一点,嗯?