定位是一種高階的布局手段
通過定位可以將元素擺放到頁面的任意位置
使用position屬性來設定定位
當元素開啟了定位以後,可以通過偏移量來設定元素的位置
例如:top:100px ; bottom :xxpx ; left、right
注意:
relative
相對定位的參照元素是其本身在文件流中的位置進行定位
相對定位會提公升元素的層級 但是不會使其脫離文件流 不會改變元素的性質,即塊元素還是塊元素,行元素還是行元素
absolute
開啟絕對定位後,元素會從文件流中脫離
絕對定位會改變元素的性質,行變成塊,塊的寬高被內容撐開
絕對定位會使元素提公升乙個層級
絕對定位元素是相對於其包含塊進行定位的
包含塊: 包含塊就是離當前元素最近的祖先塊元素
絕對定位的包含塊:就是離它最近的開啟了定位的祖先元素,如果所有的祖先元素都沒有開啟定位則根元素就是他的包含快
sticky
與相對定位差不多
不同的是粘滯定位可以在元素到達某個位置時將其固定
fixed
固定定位也是一種絕對定位
與絕對定位不同的是固定定位的參照物是瀏覽器的視口
固定定位的元素不會隨網頁的滾動條滾動
CSS定位,相對定位,絕對定位
position relative 表示相對定位。對乙個元素進行相對定位,即指通過設定垂直或水平位置,讓這個元素 相對於 它的原點起點進行移動。如果將top設定20px,那麼框將在原位置頂部下面20畫素的地方 如果將left設定為30畫素,那麼會在元素左邊建立30畫素的空間,也就是將元素向右移動,如...
絕對定位,相對定位,固定定位
通過position屬性來設定元素的定位 static 預設值,元素沒有開啟定位 relative 開啟元素的相對定位 absolute 開啟元素的絕對定位 fixed 開啟元素的固定定位 也是絕對定位的一種 說明 當開啟了元素的相對定位以後,而不設定偏移量時,元素不會發生任何變化 相對定位是相對於...
CSS之定位,相對定位,絕對定位,固定定位
1 position 屬性可以控制web瀏覽器如何以及在何處顯示特定的元素。2 可以使用position屬性把乙個元素放置到網頁中的任何位置。可選值 static 預設值,元素沒有開啟定位 relative 開啟相對定位 absolute 開啟絕對定位 fixed 開啟固定定位 3 相對定位 每個元...