Image css3渐变和透明背景图像，无冗余代码

我的页面上有一组按钮，它们有相同的渐变背景，通过蓝色类应用。我想为每一张图片添加不同的背景图片，将它们放在渐变的顶部，而不必单独使用渐变和背景图片选项对每一张图片进行编码

此问题显示了渐变+图像的方法，但要求每个按钮分别应用渐变。至少是概念证明

有没有办法把它们结合起来

CSS:

---

理论上，您应该能够为每个只应用背景图像的按钮创建一个类

乙二醇

然后是HTML

<button class="blue button1">my button</button>

---

您可以使用Gallagher的CSS2.1方法应用多个背景和伪元素：

---

此外，使用blue之类的表示类名称是一个非常糟糕的主意。如果将来你想让它变成红色呢？更改标记？

@downvoter-注释？如果我还没有理解OP，很高兴澄清一下

.button1 { background-image: url(foo.png); }

<button class="blue button1">my button</button>