定位(position)

position: relative | absolute | fixed | static | inherit;
top/right/bottom/left 定位元素偏移量。

相对定位:相对自身进行偏移

position:relative;
a、不影响元素本身的特性;
b、不使元素脱离文档流(元素移动之后原始位置会被保留);
c、如果没有定位偏移量,对元素本身没有任何影响;
d、提升层级

绝对定位:相对非static定位的第一个父级进行偏移

position:absolute;
a、使元素完全脱离文档流(不保留元素的原始位置);
b、提升层级;
c、使内联元素支持宽高设置;
d、使块元素内容撑开宽度;
e、若该元素所有父级都为static定位,则相对body进行偏移

固定定位:始终相对整个文档进行偏移

position:fixed;
a、使元素固定在页面上,不跟随滑轮滚动;
b、其余和绝对定位特性基本一致;
c、IE6不支持


注意:若父元素为绝对定位或固定定位,则其子级的浮动不会使父级产生高度塌陷,因此可以不用写清浮动方法。


定位其他值

position:static; 默认值
默认为static就是没有定位,元素出现在正常的文档流中,这时给其设置的left,right,bottom,top这些偏移属性都是没有效果的,不会生效,还有z-index属性在这时也不会生效。

position:inherit ; 从父元素继承定位属性的值 (不兼容)

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值