在Sass背景速记语法中执行多个背景
在Sass背景速记语法中执行多个背景
提问于 2017-07-13 17:41:44
我试图做一个多个背景场景，我有一个图像，然后在顶部，我有一个低不透明度的颜色，所以它显示到它下面的图像。
我知道用伪元素可以很容易地实现这样的目标，但我想尝试一下多个背景，但我不知道如何使用Sass速记和background语法来实现它。
例如，我的图像背景是这样的：
background: {
image: url('../images/hero-mobile.jpg');
position: top center;
size: cover;
repeat: no-repeat;
};但是现在我想弄清楚如何使用这个语法来添加另一个背景。
我找到了此页，它提出了如下建议：
background: {
linear-gradient(
rgba(0, 0, 0, 0.3),
rgba(0, 0, 0, 0.3)
),
image: url('../images/hero-mobile.jpg');
position: top center;
size: cover;
repeat: no-repeat;
};但是我得到了一个解析错误：
线性梯度后面必须有":“
我该怎么做呢？
回答 1
Stack Overflow用户
回答已采纳
发布于 2017-07-13 18:14:14
线性梯度不是背景的短手特性.图像、位置、大小等都是速记。
您需要将线性梯度作为图像的属性。
background: {
image: linear-gradient(
rgba(255, 0, 0, 0.45),
rgba(255, 0, 0, 0.45)
),
url('../images/hero-mobile.jpg');;
position: top center;
size: cover;
repeat: no-repeat;
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/45087626
复制相关文章
相似问题
腾讯云开发者
