我正在努力理解 css
定位。
我想要完成的是:当我设置 div
时我想要那个位置,div
在它之后,改变第一个div
的位置移动,而不重叠它们。
让我们举个例子:
HTML
<div class="wrap">
<div class="box1">
</div>
<div class="box2">
</div>
<div class="box3">
</div>
</div>
CSS
.wrap{
position: absolute;
background-color:yellow;
width:500px;
height:600px;
margin:0 auto;
}
.box1,.box2,.box3{
position: relative;
width:450px;
height:150px;
margin:0 auto;
}
.box1{background-color:red; top: 100px;}
.box2{background-color:green;}
.box3{background-color:blue;}
现在,当我设置时,例如 top:100px
在 box1
, 它去 100px
从顶部,但是box2
和 box3
仍然留在那里。当我设置 top
时我想要那个在 div
之一上的位置他们“遭受”设定位置的变化,并且不重叠或被其他人重叠div
秒
如您所见,我尝试使用 position: relative
但它没有达到我的目标。
对不起,如果我解释得更好,我很难用英语解释它。
最佳答案
top
属性(如 left
、right
和 bottom
)仅用于定位绝对元素。< br/>
将此属性赋予元素可能会赋予它绝对行为。
要定位相对元素,您应该使用 margin-top
代替。
HERE 是一个工作 fiddle
关于html - 当其他 div 改变位置时让 div 改变位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17000557/