您的位置:首页 > Web前端 > CSS

CSS Position absolute 绝对定位笔记

2013-04-28 10:57 295 查看
绝对定位具有以下特点:

绝对定位脱离文档流,不占据空间
绝对定位相对于最近的已定位祖先节点定位,已定位的祖先意思是说具有position并且值为absolute或者relative的style,如果所有祖先节点都不是已定位节点,则相对于最初始的dom节点,也就是body节点定位。
绝对定位节点相对于已定位父节点定位是指使用了top、left、right、bottom来定位。如果不设置TLRB中任何一个样式,改绝对定位节点定位在他不是绝对定位的情况下的默认位置。而单独只使用top/bottom 或者只使用left/right都不会改变另一个方向上的位置,即还是和其默认位置一致。
在理解了3的基础上,不使用TLRB定位,而使用margin-left,margin-top的方式来定位时,margin-left和margin-top类似于相对定位节点的定位,即相对于节点的默认位置定位(绝对定位由于脱离了文档流,所以设置margin-right,margin-bottom无效)。
parent设定了margin,border,padding等属性,那么这个定位点将忽略padding,将会从padding开始的地方(即只从padding的左上角开始)进行定位,这与我们会想当然的以为会以margin的左上端开始定位的想法是不同的。
给绝对定位节点设置float:left无效
Firefox给td,tr节点设置position:relative 会被Firefox忽略,而Chrome、IE则生效。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: