Twitter bootstrap 将渐变与scss颜色贴图一起使用-可能吗?

Twitter bootstrap 将渐变与scss颜色贴图一起使用-可能吗?,twitter-bootstrap,sass,bootstrap-4,Twitter Bootstrap,Sass,Bootstrap 4,我正在使用Bootstrap 4,在为我的应用程序设置主题时,我想知道是否可以在$theme colors地图中使用渐变 用法示例 $theme-colors: ( "brand-gradient": background: -moz-linear-gradient(-45deg, #fff 0%, #000 100%); ); 所以如果我想要一个按钮是渐变的,我可以 测试 然后,除了添加渐变外,还可以像通常一样为旧浏览器使用回退 只是一个好奇的问题。不幸的是,你不能。至少不是这样

我正在使用Bootstrap 4,在为我的应用程序设置主题时,我想知道是否可以在
$theme colors
地图中使用渐变

用法示例

$theme-colors: ( 
    "brand-gradient": background: -moz-linear-gradient(-45deg, #fff 0%, #000 100%);
);
所以如果我想要一个按钮是渐变的,我可以

测试

然后,除了添加渐变外,还可以像通常一样为旧浏览器使用回退


只是一个好奇的问题。

不幸的是,你不能。至少不是这样

$theme colors
中的
btn
类如下:

@each $color, $value in $theme-colors {
  .btn-#{$color} {
    @include button-variant($value, $value);
  }
}
如果您将类添加到
$theme colors
,则通常可以按照您的建议使用类
btn品牌渐变

如果您
button-variant()
您将看到它使用另一个名为
gradient-bg()
的mixin作为按钮背景和边框

在中,背景设置如下:

background: $color linear-gradient(180deg, mix($body-bg, $color, 15%), $color) repeat-x;

CSS
线性渐变
中的
$color
参数必须是有效的,而线性渐变在这种情况下是无效的。

因此,要使其起作用,我必须使用纯色,然后我所有的按钮等也都是渐变色?至少我是这样理解混合的。我的问题是,有没有一种方法可以只在特定类“btn gradient primary”指定的按钮上使用渐变?