Example Fiddle

Question

嘿我有一个愚蠢的问题。

我正在尝试创建一个按钮，其中包含.svg背景和背后的渐变。

一切都很好但是当我添加background-size来控制按钮内图像的大小时，渐变开始在一个模式中重复。像这样：

有没有办法让渐变跨越整个高度而不重复并且能够控制按钮内的图像大小？

谢谢

Answer 1

您可以在逗号分隔的列表中添加多个背景大小，就像背景图像一样。

所以，你的修复是这样的：

background-size: 50px, contain;

每个序号对应于背景图片的相同位置，因此background-size列表中的第一个项目适用于background-image

列表中的第一个项目

Answer 2

background-size也会带来多个值 - 所以只需将第二张背景图片（渐变）的大小再设置为100％，

background-size:50px, 100%;