你能设置背景图像CSS的背景颜色吗？

Question

有点奇怪的请求，但我想知道是否可以设置应用于div的背景图像的背景颜色？我知道你可以设置<img />的背景颜色。

我试过了：

background: #FFFFFF url(image.png) no-repeat bottom center;

这只会改变图像应用于div的颜色。

感谢您提供任何帮助

*编辑，添加图片以更好地解释问题：

这个右手导航中的最后一个窗格应用了背景图像/阴影，理想情况下，我希望将此阴影赋予背景颜色，以便它与页面的背景融为一体，而不是像包含div一样白。

Answer 1

使用

background: #FFFFFF url(image.png) no-repeat bottom center;

它将使用image.png填充元素（div，...）的背景，并用颜色#FFFFFF

填充其余部分

Answer 2

如果这些都是单个图像（通常认为在图像中包含内容文本是不好的做法，顺便说一句），那么我建议使用图像编辑器使块之间的空间透明（不要忘记包括阴影，所以他们有正确颜色的alpha透明度，而不是白色）。这将允许HTML元素的背景颜色显示出来。

也就是说，我会亲自将这些块放入常规文本和HTML块（因此唯一的图像是每个图像右侧的装饰图像），您可以使用box-shadow轻松添加阴影。

box-shadow属性本质上是透明的，而不是阴影本身的位置。这意味着它的“背景”将始终位于其下方（在简单的情况下，这将是包含元素的背景，但如果具有box-shadow的元素位于顶部，它也可以是文本或图像它）。

查看我的jsFiddle，看看我在说什么（这是一个快速的，所以它看起来不像你想要的效果，但这种效果可能带来一点创造力）：{{ 3}}