html - 如何让 div 落后于另一个 div？

Question

我试图让“box-left-mini”位于下方的 div 之前。

<div class="box-left-mini">
   this div is infront
    <div style="background-image:url(/images/hotcampaigns/campaign-sample.png);height:100px;width:100px;">
        this div is behind
    </div>
</div>

box-left-mini 的 CSS 是:

.box-left-mini {
    float:left;
    background-image:url(website-content/hotcampaign.png);
    width:292px;
    height:141px;
}

Answer 1

您得到这么多不同答案的原因是您没有准确解释您想要做什么。您通过代码获得的所有答案在编程上都是正确的，但这完全取决于您想要实现的目标

.box-left-mini{
    float:left;
    background-image:url(website-content/hotcampaign.png);
    width:292px;
    height:141px;
}

.box-left-mini .front {
    display: block;
    z-index: 5;
    position: relative;
}
.box-left-mini .front span {
    background: #fff
}

.box-left-mini .behind_container {
    background-color: #ff0;
    position: relative;
    top: -18px;
}
.box-left-mini .behind {
    display: block;
    z-index: 3;
}

<div class="box-left-mini">
    <div class="front"><span>this is in front</span></div>
    <div class="behind_container">
        <div class="behind">behind</div>        
    </div>
</div>