static: 預設值。無特殊定位，物件遵循html定位規則
absolute: 將物件從文件流中拖出,使用left,right,top,bottom 等屬性相對於其最接近的乙個最有定位設定的父物件進行絕對定位。如果不存在這樣的父物件,則依據body物件。而其層疊通過z-index屬性定義
fixed:未支援。物件定位遵從絕對(absolute)方式。但是要遵守一些規範
relative:物件不可層疊，但將依據 left,right,top,bottom 等屬性在正常文件流中偏移位置
我們定義了乙個有邊框，行間距為18px，外間距為50px的容器demo，如圖黑框就是。
預設情況下position選擇的是position:static沒有定位，元素出現在正常的流中（忽略 top, bottom, left, right 或者 z-index
宣告）所以左上角我們可以看到static的塊，哪怕css寫了left:200px;top:50px;也沒什麼卵用。。直接就是容器裡的容器預設該出現在哪
就是在哪。
接著再看右下角fixed的塊，由於css寫了right:0px;bottom:0px;，這個是相對於
瀏覽器視窗而言的，即它會鎖死在你可見範圍的某
理。 接下來再看中間relative的塊，如果這個塊是
position:static的，毫無疑問會出現在原來static框的正下方。如下圖：
而relative是生成相對定位的元素，相對於其正常位置進行定位。
即接下來的定位都是相對於上圖粉色框（static框的正下方）來
操作的。比如left:400px;就是在原來的位置基礎上向右移動400px,top:-20px;就是向上移動20px。正是最開始那幅圖的位置。
最後再看看比較棘手的absolute塊，雖然是絕對定位，但還是
相對於 static 定位以外的第乙個父元素進行定位。
所以，我們先去
找父元素，發現demo就是了（定義了position:relative;），那麼實際上我們是等下的操作將是相對於demo這個框來進行的。因此
right:0px;就是離demo的右邊框距離為0，top:0px;就是離demo的上邊框距離為0.又因為absolute不再屬於文件流，所以這裡可以看
到是類似於float那樣浮動著的，而且它的位置跟上面所說的fixed差不多，如果你拉動了瀏覽器導致框變短了，那我不管，框的右
上角還是得有這個absolute框。如下圖：
如果再拉近一點，粉色框就會被拉到螢幕外不可見，灰色框也會被藍色框徹底覆蓋。。。。
對了，藍色出來的底部尾巴和粉色框出來的右邊尾巴可以在demo那裡定義over-flow:hidden;隱藏起來
position：abosolute;相對於document顯示區左上角位置的，絕對定位是根據父元素（同樣設定了position屬性的html元素（除了
position:static））的定位，
當父級元素設定相對定位或者絕對定位後，那子元素用絕對定位才是相對於父級元素左上角1,1座標
定位。如果不存在這樣的包含塊，則相對於body元素，即相對於瀏覽器視窗。如果相對於瀏覽器視窗
那麼位置變化參照下條fixed，
如果不是，那麼參照上面demo框變化時的情況。
position：fixed才是相對於瀏覽器的絕對定位，就是說不管如何拖動滾動條，該div始終位於視窗某個位置，類似漂浮的小廣告
position：relative是相對於同級元素定位，即相對於自己的正常位置時的定位。在設定position:relative後你把left、top等屬
性設定為0px時的位置就是正常位置。它設定偏移後會空出來一些空白，其餘的html元素不會填充這些空白。
關於CSS定位的一些總結
所有主流瀏覽器都支援 position 屬性。position屬性規定元素的定位型別，影響元素框生成的方式。值描述 absolute 生成絕對定位的元素，相對於 static 定位以外的第乙個父元素進行定位，如果不存在這樣的父元素，則依據最初的包含快。根據使用者 的不同，最初的包含塊可能是畫布或 h...
關於css定位的一些自我總結
在瀏覽 時 我們經常會看到一些 文字在上面 導航欄一直在頁面的最上面之類的 css定位position允許你對元素進行定位 它常用的屬性值一般為5個分別為 static 預設值 設定該屬性是元素會正常顯示 不會識別 left right top bottom指定的座標 absolute 絕對定位，相...
關於css浮動的一些理解
學習了後的一些體會 今天自學css的浮動 float 時，一直看不懂w3school上的一段 具體如下 never increase,beyond what is necessary,the number of entities required to explain anything.willia...