CSS：底部有透明图像的div

Div必须在顶部有一个纯色，然后在底部应该是1px宽的透明图像。（所以最后一下应该是，我有一个梯度，从上格的底部）当我把：

background: #fff url("../../images/bck1px.png") repeat-x scroll center bottom transparent;

白颜色显示在透明图像

我不得不这样做在CSS2风格！

任何人都可以帮忙吗？

2011-12-06 mikipero

职位上的jsfiddle – bravedick

这里的jsfiddle链接：http://jsfiddle.net/komunca/Q2NCE/19/。我想在前面的div下推出渐变图像！ – mikipero

这是一个链接...也许这就是你想要做的。

如果是的话，诀窍是使用图像，并让它在div底部对齐并水平重复。清楚的是确保推动你的容器div的底部。

好运

2011-12-06 17:58:13

但我的图像是不同的，它是白色的顶部和透明的底部，这样在css中定义的颜色将覆盖图像！（因为它是透明的） – mikipero

好吧，也许这更像它..http：//jsfiddle.net/etienne_carre/GEkFn/13/ –

抱歉，我们如何删除底部填充，并使用相同的图像？（所以底部的文字背景是那个图像）？ – mikipero

这并不完全清楚你问什么 - 透明图像是透明的，所以它不会创建渐变。

在您发布的代码中，您应用了白色背景色和图像（background: #fff url...）。如果省略颜色（background: url...），则不应再变白。我不知道这是否能解决您的问题。

如果您可以发布应用于<div>的所有CSS，那可能会有所帮助。

2011-12-06 10:29:31

这是链接jsfiddle.net/komunca/Q2NCE/19 – mikipero

如果有人曾经来到这里，未来终于来了并且有更好的方法来做到这一点。

请参考一个CSS方法如下链接： Gradient opacity on the bottom of div

2016-05-31 16:08:18 Gonzalo

从[帮助中心]（http://stackoverflow.com/help/how-to-answer）：鼓励与外部资源的链接，但请在链接的周围添加上下文，以便您的同行用户可以了解它是什么是，为什么它在那里。如果目标网站无法访问或永久离线，请始终引用重要链接中最相关的部分。 – Adam

回答