關於css中的position定位

　　但願這波position能夠有幫助^_^!

　　css中的position屬性主要分爲：static、relative、absolute、fixed、center、page、sticky（紅色是css3中才可以使用的值）

　　1.static：對象遵循常規流。此時4個定位偏移屬性不會被應用。

　　2.relative：對象遵循常規流，而且參照自身在常規流中的位置經過top，right，bottom，left這4個定位偏移屬性進行偏移時不會影響常規流中的任何元素。

　　3.absolute：對象脫離常規流，此時偏移屬性參照的是離自身最近的定位祖先元素，若是沒有定位的祖先元素，則一直回溯到body元素。盒子的偏移位置不影響常規流中的任何元素，其margin不與其餘任何margin摺疊。

　　4.fixed：與absolute一致，但偏移定位是以窗口爲參考。當出現滾動條時，對象不會隨着滾動。

　　5.center（css3中使用）：與absolute一致，但偏移定位是以定位祖先元素的中心點爲參考。盒子在其包含容器垂直水平居中。

　　6.page（css3中使用）：與absolute一致。元素在分頁媒體或者區域塊內，元素的包含塊始終是初始包含塊，不然取決於每一個absolute模式。

　　7.sticky（css3中使用）：對象在常態時遵循常規流。它就像是relative和fixed的合體，當在屏幕中時按常規流排版，當捲動到屏幕外時則表現如fixed。該屬性的表現是現實中你見到的吸附效果。

　　（1,2,3在各個瀏覽器下都支持；4在ie6.0中不支持，在androidBrowser2.1-2.3#3中部分支持；5,6都不支持；7在Firefox32.0+和Safari6.1-9.0【webkit】中支持）

　　舉個栗子（舉最經常使用的1,2,3,4）：

　　　　1.static：

　　　　

　　　　2.relative：

　　　　

　　　　3.absolute：

　　　　

　　　　4.fixed：

　　　　

　　　　加油！