首页 > 代码库 > 深入理解absolute
深入理解absolute
一、absolute和float
1.相同的特性表现:
<1>包裹性
<2>破坏性
注意:有时候,其页面布局可以相互替换--------float:;=position:absolute:
2.clear用来限制float;relative用来限制absolute,独立的absolute可以摆脱overflow的限制,无论滚动还是隐藏。
absolute越独立越强大!
3.绝对定位的行为表现:
<1>脱离文档流
<2>去浮动
float造成的环绕效果,absolute保持跟随效果,absolute存在时float失效
<3>位置跟随
元素是block那么absolute之后依然是block排列,inline时absolute后依然是inline排列。
<4>超越overflow
当父元素没有设置position:relatinve时,子元素position:absolute会超越父元素的overflow: :会显示父元素div以外的样式。
当父元素设置了position:relative后,子元素就算设置了绝对定位,那么其都不会显示父元素以外的样式了。
注意:在IE7下,任何元素采用绝对定位后,都会inline-block化
解决办法: 在绝对定位元素外面套一层空div就OK
二、配合margin的精确定位
1.支持负值定位
2.兼容性超赞---可兼容IE6
深入理解absolute
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。