如何在 Sass 中的色彩图中设置线性渐变

Question

我正在尝试在我的 ionic 2 项目中在颜色图中设置线性渐变，但总是收到错误。

$color (
  light:    #fefefe,
  dark:     #333,
  cool:     linear-gradient('#0005de', '#12dfff')
)

如何设置线性渐变

Answer 1

地图的设置应该看起来像这样：

$color: (
  light: #444,
  dark: #111,
  cool: linear-gradient(#0005de, #12dfff)
);

注意：如果要更改线性渐变的旋转，则应使用如下语法linear-gradient(45deg, #0005de, #12dfff) 。此外，#111 比 #444 更暗。

要将颜色用作属性值，您必须使用 map-get 函数，如下所示：

.selector {
  background: map-get($color, cool);
}