html – Z-index不工作img元素隐藏在父div之后

2023年11月12日 195次阅读

我需要将img元素(以及有关项目的其他相关信息)放在div的右下角,类为“projectItem green”.

定位工作正常,但我不能让两个父div下的img元素在屏幕上可见.元素突出显示实际上突出显示元素,但您只能看到不可见元素周围的网格.

我试图将该z-index与img元素一起使用而不是div.我还尝试将display：block参数添加到img元素并在那里使用z-index.

任何指针都非常有用！

这是我的代码

<div class="projectItem green">
  <div class="projectNumber">I-8000</div>
  <div title="Testprojekt 25.05.2018" class="halfWidth">Testprojekt 25.05.2018</div>
  <div class="halfWidth"><span>Start:&nbsp;</span><span>5/25/2018</span></div>
  <div title="" class="halfWidth">UserName</div>
  <div class="halfWidth"><span>End:&nbsp;</span><span style="margin-left: 8px;">6/1/2020</span></div>
  <div class="halfWidth">Last status update:</div>
  <div class="halfWidth"><span style="margin-left: 43px;">5/25/2018</span></div>
  <div style="width: 100%; display: inline-block; position: relative; z-index: 1000;"><img style="position: absolute; bottom: 0; right: 0"
     src="/system/pscbaf/ImagesLogos/IPM/IPM_NotReported_Icon.PNG"> 
  </div>
</div>

这是DOM的截图

《html – Z-index不工作img元素隐藏在父div之后》

这是我得到的

《html – Z-index不工作img元素隐藏在父div之后》

这是我想要实现的目标

《html – Z-index不工作img元素隐藏在父div之后》

最佳答案 您可以向其他元素添加一些z-index,该值将小于img的z-index

点赞