如何在css中重疊兩個div？

Question

我有兩個div喜歡，

<div class="imageDiv"></div>
<div class="imageDiv"></div>

和css類，

 .imageDiv
    {
        margin-left: 100px;
        background: #fff;
        display: block;
        width: 345px;
        height: 220px;
        padding: 10px;
        border-radius: 2px 2px 2px 2px;
        -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
        -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
        box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    }

你可以在這里看到結果:)

我想重疊這兩個div喜歡，

Answer 1

添加到第二個 div bottomDiv

並將其添加到 css 中。

 .bottomDiv{
       position:relative;
       bottom:150px;
       left:150px;
    }

http://jsfiddle.net/aw8RD/1/

Answer 2

看這里的演示你需要為第二個div引入一個額外的類

.overlap{
    top: -30px;
position: relative;
left: 30px;
}

Answer 3

我編輯了你的小提琴，你只需要將z-index添加到前面的元素並相應地定位它。

Answer 4

檢查這個小提琴，如果你想移動重疊的 div 你將它的位置設置為absolute然后改變它的top和left值

Answer 5

為什么不只使用一個 div 然后使用偽元素 :: before 或 ::after 並將該偽元素的位置設置為絕對然后設置 top: 100px 和 left 100px