定位的作用: 定位=定位模式+边偏移 1、定位模式position属性,有如下五个值: static:静态定位,是默认值,元素仍然是标准流 relative:相对定位 absolute:绝对定位 fixed:固定定位 sticky:黏性定位 2、边偏移属性: top: 10px顶端偏移量10像素:相对于父元素上边线的距离 bottom: 10px;底端偏移量10像素:相对于父元素下边线的距离 left: 10px;左侧偏移量10像素:相对于父元素左侧边线的距离 right: 10px;右侧偏移量10像素:相对于父元素右侧边线的距离
相对定位(占位置) 特点: 1.是相对于自身原来的位置来偏移的; 2.原来在标准流的位置继续占有。
绝对定位(不占位置,完全脱标) 特点: 1.是以它最近一级带有定位的父亲(祖先)为参考; 2.若祖先没有加定位,则以浏览器为参考。 此处:重要一点:应当“子绝父相”:即子元素绝对定位时,给其亲爹加上相对定位。
固定定位(不占位置,完全脱标) 特点: 1.跟父元素无关 2.不随滚动条移动 3.不占有原位置
黏性定位(占位置) 特点: 1.以浏览器的可视窗口为参照 2.黏性定位占有原先的位置 3.必须添加top,left,right,bottom其中一个