下面這個(gè)例子 如果給第二個(gè)DIV 設(shè)置float:left屬性，第一個(gè)DIV會(huì)再下沉20px;并且文字進(jìn)入第二個(gè)div； 而第二個(gè)DIV的文字留在原地？<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>無(wú)標(biāo)題文檔</title><style>*{ margin:0; padding:0; }div{ width:300px; height:100px; margin:20px}.one{ border:2px solid yellow; float:left}.two{ border:2px solid blue; }</style></head><body><div class="one">1</div><div class="two">22</div></body></html>
7 回答
-
夜月見黑好的我看看
qyy2499760117_葉子
TA貢獻(xiàn)188條經(jīng)驗(yàn) 獲得超91個(gè)贊
你你用谷歌瀏覽器調(diào)試就看得懂了，浮動(dòng)一般用在兩個(gè)或多個(gè)div在一個(gè)大容器中，你這里的大容器是body，所以兩個(gè)div重疊， 當(dāng)你給第二個(gè)div容器設(shè)置float:left時(shí)，第二個(gè)div會(huì)像body大容器向左靠，因?yàn)槟阍O(shè)置了div?{margin:20px},所以第一個(gè)DIV會(huì)再下沉20px;?受浮動(dòng)的影響第二個(gè)DIV的文字留在原地。
你調(diào)試一下，想想你設(shè)置的屬性會(huì)對(duì)哪些元素有影響，就懂了。
-
夜月見黑我試下
-
qyy2499760117_葉子嗯嗯。
o_n
TA貢獻(xiàn)56條經(jīng)驗(yàn) 獲得超20個(gè)贊
你知道z-index屬性嗎，它可以定義樣式之間的層疊關(guān)系，比如屬性值是2的會(huì)覆蓋在1上面。那么設(shè)置了float屬性的元素就會(huì)漂浮在以前平面的上方，相當(dāng)于z-index屬性值相對(duì)于以前增加了。
添加回答
舉報(bào)
0/150
提交
取消