css之相對定位與絕對定位

絕對定位,position:absolute;會脫離原來的文檔流,並讓出自己的位置。也就是說:它會浮起來,並且原來佔有的位置會被其它的塊替代。

相對定位:position:relative;還是會佔用原來的位置,不會脫離原來的文檔流,也會浮起來。

當一個盒子是用的“絕對定位的時候,它的最外層一定會有個“相對定位的容器”,即這個容器會有一個position:relative;這樣這個絕對定位的盒子就會以最近的這個position:relative;作爲參考的絕對定位的一個參考物。如果沒有一個容器有position屬性,則它會把body作爲參考物。

另外當一個盒子是用positon:relative;定位,並且,還有margin-top:  和margin-left這樣的margin的時候,即使最外層有個postion:relative的盒子,這個margin-top 和margin-left 還是以它前面的一個盒子作爲參考對象定位。




發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章