html - 你可以设置背景图像 CSS 的背景颜色吗？

Question

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

我试过:

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

这只是改变了应用图像的 div 的颜色。

感谢您的帮助

*编辑，添加图像以更好地解释问题:

右侧导航栏中的最后一个 pod 应用了背景图像/阴影，理想情况下我想给这个阴影一个背景颜色，以便它与页面背景融为一体，而不是像包含的 div 那样是白色的。

Answer 1

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

就是说，我个人会将这些 block 制作成常规文本和 HTML block (因此唯一的图像是每个 block 右侧的装饰图像)，您可以使用 box 轻松地为其添加阴影-阴影。

box-shadow 属性本质上是透明的，除了阴影本身。这意味着它的“背景”将始终是它下面的内容(在简单的情况下，这将是包含元素的背景，但它也可以是文本或图像，如果元素带有 box-shadow 在它上面)。

看看我的 jsFiddle 看看我在说什么(这是一个快速的，所以它看起来并不完全像你想要的效果，但只要有一点创意就可以实现这种效果):http://jsfiddle.net/DXrk6/1/