postion定位⼀.固定定位属性值:fixed
1. 相对于浏览器窗⼝定位
2. 随着内容⼀起滚动
⼆.相对定位属性值:relative
1. 相对于它本⾝正常位置发⽣位置改变
2. 关键词: left / top / right / bottom 来改变位置
3. 特性:
1) 相对定位元素不脱离⽂档流
2) 相对定位元素不影响元素本⾝特性
3) 如果没有关键词来改变位置,元素本⾝不会发⽣任何变化
4) 位置改变,原来的位置⼀直占据着
三.绝对定位属性值:absolute
1. 相对于已经定位的上级元素来发⽣位置改变
1) 定位上级包括:fixed relative absolute
2) 没有上级定位元素参考,相对于body
2. 关键词: left / top / right / bottom
3. 特性:
1) 完全脱离⽂档流
2) ⾏内元素⽀持宽⾼
3) margin:auto;⽆效
四.层级属性:z-index
五.绝定位元素居中⽅法
关键词都为0,margin:auto;
div{
position:absolute;
left:0;
right:0;
top:0;
bottom:0;
margin:auto;
}
absolute relative百分数居中减去定位元素宽⾼⼀半
div{
position:absolute;
width:100px;
height:100px;
left:50%;
top:50%;
margin-left:-50px;
margin-top:-50px;
}
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论