[原创] css中的绝对定位和相对定位

我对博客的认识是：记录问题，解决问题，分享知识。如果有轮子，我不需要造轮子。

　   首先，定位无论是相对定位还是绝对定位，必须有一个参考项，而这个参考项，专业术语称之为 包含块，这里的包含块是指在定位时候的包含块，具体有关包含块的概念和意义自行研究。

对于定位postition属性而言，包含块的判定如下(记住就好，理解了就更好)：

1.根元素的包含块，根元素一般是html元素，有些浏览器会使用body作为根元素，大多数浏览器，初始包含块是一个视窗大小的矩形

2.非根元素的包含块，如果该元素的position是relative或static，它的包含块是最近的块级框，表的单元格或行内块的内容边界

3.非根元素的包含块，如果该元素的position是absolute，则包含块为最近的position不是static的祖先元素。简单来说，它的包含块会从父级元素一直向上查找，找到第一个position不是static的元素为止。

4.fixed定位很简单，类似与absoulte，但是它的包含块就是浏览器窗口，相对来说简单很多。常见的应用比如固定导航，回到顶部。

参考

1.基础教程

2.详解CSS position属性

3.css的float属性

4.CSS3包含块及其定位判定