Question

我一直试图将图像放在div上，我的div是

.my_box{
position: relative;
left: 200px;
width: 200px;
height: 200px;
background-color: white;
opacity: 0.7; 
}

然后我的形象是

.asvp{
position:relative;
left: 300px;
top: 100px;

}

当我这样做是将图像放在div下面，我该怎么做才能将它放在div上？我知道将图像放入div中，但这会使我不想要的图像不透明。

Answer 1

尝试将z-index:1添加到.my_box，将z-index: 10添加到.asvp。但是，如果没有HTML代码，很难挂钩。如果这不起作用，请创建一个jsFiddle，我会解决你。：）

您还应该使用边距而不是left和top。例如，在.asvp上移除左侧和顶部并放置margin: 100px 0 0 300px;。作为一般经验法则，我只对绝对元素使用左，右，上，下。

Answer 2

为什么不给你的形象位置：绝对;相反......会自动将它放在它上面

Answer 3

您可以将图像保留在div内，而不会影响其内容，而不是重新定位。如果它是一个像你的例子中那样的纯半透明背景，你可以在div上使用rgba值，如下所示：

background-color: rgba(255,255,255,0.7);