0_4 CSS定位、層級
阿新 • • 發佈:2022-03-03
1.定位,
一種更高階的佈局手段,可以通過定位把元素擺放在頁面的任意位置
使用position屬性設定定位
1.1 position可選值:
static 預設值
relative 相對定位,參考元素在文件流中的位置,提升層級,不脫離文件流,不改變元素性質(塊、行內)
absolute 絕對定位,參考元素在包含塊(開啟定位的祖先元素||根元素),提升層級,改變元素性質
fixed 固定定位,一種絕對定位,但是參考瀏覽器的視口
sticky 粘滯定位,和相對定位特點基本一致,但是設定的是--元素到達某個位置時將其固定
1.2 定位的偏移量
元素開啟定位以後,通過偏移量設定元素位置
top 定位元素和參考元素上邊的距離
bottom ......
left ......
right ......
2、元素的層級 z-index
開啟了定位的元素,通過設定z-index指定層級,層級越高越優先顯示
層級一樣則優先顯示靠下的元素,
祖先元素層級再高也不會蓋住後代元素