課程
/前端開發
/HTML/CSS
/網頁布局基礎
老師,相對定位和絕對定位的區別是什么?什么時候用相對定位,什么時候用絕對定位,
2015-12-21
源自:網頁布局基礎 4-3
正在回答
相對定位:應用relative 屬性后具有空間層堆疊的性質,且原來占據的空間保留,相當于原位置留空并在上面一層相對于自身偏移。跟它的名一樣,相對嘛,要有一個參照物,但這個參照不是別的,是它自己呢,也就是說沒設相對定位的位置,那你會問了,設沒設都在那個位置為什么要設呢,因為只有設置了才能使 TOP,LEFT這些生效,也就是設了才能相對自己原來的位置偏移,原來的位置保留著,偏移后會把其它的層遮罩住。
絕對定位:脫離文檔流,絕對定位一定要參照物,否則直接Body來定位的。在布局里不可能有絕對定位的,再怎么樣都有一個參照位置的,絕對定位的參照位置就不像相對那樣是自己了,至于是哪個,就看它的上級或上上級有沒有定位了,也就是有沒有position:relative;或position:fixed了,好像position:inherit;也行,前面兩個可以,后面那個不設什么的不用也行,最好用position:relative。它會像PS的圖層一樣單獨做一層,至于第幾層你可以通過z-index:這個屬性來設置
相對定位>絕對定位。就是父元素用相對定位,子元素用絕對定位。這樣才能有效果。
假如你家有三層,你就是一個文本元素,相對定位的意思就是你只能在某一層樓走動,而絕對定位的話就是你可以在三層樓隨意走動,Got it?你暫時可以記?。航^對定位是脫離文本流的,而相對定位沒有
舉報
讓你精通CSS中三大定位機制,徹底掌握網頁布局的相關知識
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網安備11010802030151號
購課補貼聯系客服咨詢優惠詳情
慕課網APP您的移動學習伙伴
掃描二維碼關注慕課網微信公眾號
2016-01-22
相對定位:應用relative 屬性后具有空間層堆疊的性質,且原來占據的空間保留,相當于原位置留空并在上面一層相對于自身偏移。跟它的名一樣,相對嘛,要有一個參照物,但這個參照不是別的,是它自己呢,也就是說沒設相對定位的位置,那你會問了,設沒設都在那個位置為什么要設呢,因為只有設置了才能使 TOP,LEFT這些生效,也就是設了才能相對自己原來的位置偏移,原來的位置保留著,偏移后會把其它的層遮罩住。
絕對定位:脫離文檔流,絕對定位一定要參照物,否則直接Body來定位的。在布局里不可能有絕對定位的,再怎么樣都有一個參照位置的,絕對定位的參照位置就不像相對那樣是自己了,至于是哪個,就看它的上級或上上級有沒有定位了,也就是有沒有position:relative;或position:fixed了,好像position:inherit;也行,前面兩個可以,后面那個不設什么的不用也行,最好用position:relative。它會像PS的圖層一樣單獨做一層,至于第幾層你可以通過z-index:這個屬性來設置
2015-12-21
相對定位>絕對定位。就是父元素用相對定位,子元素用絕對定位。這樣才能有效果。
2015-12-21
假如你家有三層,你就是一個文本元素,相對定位的意思就是你只能在某一層樓走動,而絕對定位的話就是你可以在三層樓隨意走動,Got it?你暫時可以記?。航^對定位是脫離文本流的,而相對定位沒有