我有一個 div，它在另一個 div 中有一個影像。我想將內部 div 放在第二個 div 上。所以下圖中的箭頭應該越過紅色。這可能嗎？
.puscicaAnimacija {
bottom: -2%;
height: 5%;
margin-bottom: -10px;
z-index: 2;
position: absolute;
}<div class="first">
<div style="display: flex; justify-content: center;">
<img src="https://via.placeholder.com/100" class="puscicaAnimacija" />
</div>
</div>
<div class="second">
</div>uj5u.com熱心網友回復：
您應該放置position:relative參考.puscicaAnimacija該類的第二個 div，然后在第二個元素上使用屬性 z-index，其值高于第一個元素。
.puscicaAnimacija{
position: relative;
}
.second{
position: absolute;
z-index: 3;
}
uj5u.com熱心網友回復：
為了使用 z-index，必須定位父元素。position:relative在您要置于其下的 div 上使用。
uj5u.com熱心網友回復：
在看不到所有代碼的情況下，您可以在下面執行類似的操作。我已經將您的一些類名轉換為命名類，并添加了一些額外的 CSS 以用于示例目的，但想法是一樣的。
.first {
background: navy;
width: 300px;
height: 100px;
position: relative;
}
.ontop {
background: whitesmoke;
width: 300px;
height: 50px;
position: absolute;
bottom: 0;
}
.second {
background: red;
width: 300px;
height: 50px;
}
.puscicaAnimacija {
bottom: -40%;
left: 10%;
height: 48px;
position: absolute;
}<div class="first">
<div class="ontop">
<img src="https://cdn-icons-png.flaticon.com/512/159/159119.png" class="puscicaAnimacija" />
</div>
</div>
<div class="second">
</div>轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/534236.html