如何在自定义Bootstrap中使用渐变？

Question

我想将自定义sass Bootstrap的主要颜色设置为渐变但是当我将自定义变量定义为渐变时，我收到错误消息

  

“错误：$ color：线性渐变（右边，＃c33764，＃1d2671）不是   变暗的颜色。“

现在，我知道变暗文件中的链接以及其他许多地方的链接变暗，这意味着链接颜色是主要颜色的深度百分比。我怎样才能做到这一点？

这是我的_custom.scss，它作为bootstrap.scss中的第一个部分包含在内：

$celestial: linear-gradient(to right, #c33764, #1d2671);
$primary: $celestial;

Answer 1

linear-gradient仅对background css属性有效，而$primary bootstrap变量需要颜色。

您要做的是直接定位您想要直接应用渐变的元素：

.navbar {
  background: linear-gradient(to right, #c33764, #1d2671);
}