如何在CSS中重叠两个div?

时间:2013-05-04 07:59:31

标签: html css

我有两个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;
    }

您可以看到结果Here:)

我想重叠这两个div喜欢,

enter image description here

4 个答案:

答案 0 :(得分:17)

添加到第二个div bottomDiv

并将其添加到css。

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

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

答案 1 :(得分:2)

See demo here你需要为第二个div引入一个额外的类

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

答案 2 :(得分:1)

选中此fiddle,如果您想移动重叠的div,请将其位置设置为absolute,然后更改topleft值< / p>

答案 3 :(得分:0)

我编辑了你fiddle 你只需要将z-index添加到前面元素并相应地定位它。