文章内容
Div 改变position 为absolute 是如何进行偏移的
如下页面，设置 div2 属性 position: absolute
<body>
<div id="mainDiv"style="max-width:500px;min-height:500px;max-height:500px;border:1px solid red">
<div id="div1"></div>
<div id="div2"></div>
<div id="div3"></div>
</div>
</body>#div1{
height:60px;
width:60px;
border :1px solid red;
}
#div2{
position :absolute;
top: 100px;
left: 100px;
height:60px;
width:60px;
border :1px solid red;
}
#div3{
height:60px;
width:60px;
border :1px solid red;
}
当我们设置div2 position:absolute之后 div2 脱离流，并以自身的第一个父元素进行定位，偏移
那么div2具体是如何偏移定位的，看下图
大红框为mainDiv,div2以mainDiv中心进行偏移。
top: 100px ----div2从mainDiv top 开始向下偏移 100px，向中心方向偏移
若设置 top: -100px ----div2从mainDiv top 开始向上偏移 100px，向中心反方向偏移
总结 已中心方向偏移为正，反之为负
扫一扫
1471
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
