Question

我试图将DIV重叠到其他视觉上。我正在尝试

{
position:absolute;
top:-10px;
}

在css中，但我发现这个顶级属性在firefox中无法正常工作。亲爱的伙计们，怎么办？请帮我一些代码或示例。 thx提前

Answer 1

这是一个简单的方法

CSS

.top {
    position: relative;
}
.topabs {
    position: absolute;
}

HTML

<div class='top'>
    <div class='topabs'>
        I'm the top div
    </div>
</div>
<div>No styles, just frowns :(</div>

由于没有内容，相对定位的div会折叠，导致绝对定位div的坐标0,0坐标为下面div的坐标。

小提琴

http://jsfiddle.net/y5SzW/

Answer 2

试试这个，我喜欢用这种东西的相对位置。

<html>
<head>
    <style type="text/css">
    body{
    background-color: #000;
    padding:0;
    margin:0;
    }

    #bottom {
    width: 200px;
    height: 200px;
    border: 5px #fff solid;
    background-color:#f00;
    margin: 0 auto;
    }

    .top {
    width: 200px;
    height:200px;
    top: 10px;
    left: -100px;
    z-index: 10; 
    background-color: #00f;
    color: #333;
    border: 5px solid #fff;
    position: relative;

    }
    </style>
</head>
<body>
    <div id="bottom">
        <div class="top"></div>
    </div>
</body>
</head>

我当然会在以后将CSS分成自己的文件。

Answer 3

只需使用position: relative代替绝对，或添加否定margin-top: -10px。

我如何将DIV与其他DIV重叠？

3 个答案:

CSS

HTML

小提琴