5 回答

TA貢獻(xiàn)35條經(jīng)驗(yàn) 獲得超41個(gè)贊
對(duì)比一下不設(shè)置position,和relative,absolute的圖。
可以看出不設(shè)置和設(shè)置relative兩張圖文字位置沒(méi)有任何變化。因?yàn)閜osition:relative不會(huì)脫離文檔流。雖然通過(guò)設(shè)置left和top移動(dòng)了div,但是文檔流中依然占據(jù)最開(kāi)始的位置,不會(huì)影響其他元素。假設(shè)你不設(shè)置left和top值,那么兩張圖是完全一樣的。
而第三張圖中,可以看出文字跑到最上面了。因?yàn)閜osition:absolute會(huì)脫離文檔流。只是你移動(dòng)了div,看起來(lái)不在一起。如果不設(shè)置top和left的話,就會(huì)發(fā)現(xiàn)div沒(méi)動(dòng),但是文字跑上來(lái)重疊在一起了。
你把top和left都去掉,再在瀏覽器中查看就會(huì)明白了。
順便說(shuō)一下,css里的注釋不能用//,你看你圖片里的注釋都沒(méi)有變灰。只是剛好因?yàn)榧恿?/瀏覽器不認(rèn)識(shí)所以沒(méi)有執(zhí)行。

TA貢獻(xiàn)319條經(jīng)驗(yàn) 獲得超234個(gè)贊
設(shè)置position,盒子脫離了文本流,另外設(shè)置float也會(huì)脫離文本流,你可以單獨(dú)把這些試一下,下次遇到這種問(wèn)題就明白了;
你的position:absolute,沒(méi)有注釋成功,css的注釋是/*注釋內(nèi)容*/, ? ?html的注釋是<!--注釋內(nèi)容--> ?,? ?js的注釋是//注釋內(nèi)容 ?,sumblime注釋的快捷鍵是,選中要注釋的文本按ctrl+/

TA貢獻(xiàn)188條經(jīng)驗(yàn) 獲得超91個(gè)贊
這節(jié)課講的是? ? position:relative;的作用,偏移位置保留不懂。

TA貢獻(xiàn)128條經(jīng)驗(yàn) 獲得超67個(gè)贊
設(shè)置relative你可以想象一下,這個(gè)div是個(gè)飛機(jī),從停機(jī)坪飛起來(lái),飛到別的地方去了。但是。。這個(gè)停機(jī)坪還是要給他留著的,否則飛不回來(lái)了。。。
添加回答
舉報(bào)