Question

我有一个div，我在里面用img标签放置一个图像

在样式表中，我使用了该div的背景图像，并将其与z-index值1对齐。

我在该div中使用另一种样式的img，其中z-index值为-100

所以我希望背景图像能够出现在图像的前面..

我认为我做错了什么

我的代码是

.video-thumb
{
height:72px;
width:120px;
background:#ffffff;
background-image:url('http://doamin.com/images/play.png');
background-repeat:no-repeat;
background-position:center; 
padding:4px;
border:#eceaea 1px solid;
margin:0 auto;
z-index:2;
}

.video-thumb img
{
    z-index:-100;
}

<div class='video-thumb'>
<a href=\"somthing.php\">
<img id='thumb' width=120 height=72 src='http://domain.com/image1.jpg'></a>
</div>

Answer 1

仅当图像不在div内时才会出现这种情况。因为图像在div内，所以它实际上只有一个z-index相对于其他元素（在同一个父元素内）。

只需添加上述内容，z-index也只适用于display：absolute;适用于他们。即使是这种情况，您也不会在其父元素的背景后面显示图像。

如何在img标签内容之前设置背景图像？

1 个答案: