已采納回答 / 慕粉3759934
margin負值是反方向移動.我把這里的margin拆分了,你看的清除點margin-top: -150px; ? 這里的意思是,元素向上移動150px,為什么是150px .因為150px是高度300px的一半,同樣的道理margin-left:-250px? ? 元素向左移動寬度的一半left:50%和top:50%只是把元素的左上角原點居中了,并不是整個元素居中,要想讓元素居中,就要把元素向左邊拉回來一半的寬度,和向上拉一半的高度
2016-09-03
關于最后的距離,我說下自己實踐后的結果!
你可以看到mid div圖片的寬是649,然后它在style中定義的border是1,加起來就是在style中給的650。
你可以試試把border改為100,你可以在右邊看到border變寬了,實際mid div的寬度也變大了,但是圖片的寬度沒變,是不是可以理解為style中定義的width并沒有什么意義,實際上你刪掉那句width:650px試試;確實可以看出沒有影響,所以我覺得她給的寬度就是給你的參考值!
最后一步我認為是110+650+17=777。(我是把mainbody設為relative)
有什么理解不到位的地方,歡迎指正!
你可以看到mid div圖片的寬是649,然后它在style中定義的border是1,加起來就是在style中給的650。
你可以試試把border改為100,你可以在右邊看到border變寬了,實際mid div的寬度也變大了,但是圖片的寬度沒變,是不是可以理解為style中定義的width并沒有什么意義,實際上你刪掉那句width:650px試試;確實可以看出沒有影響,所以我覺得她給的寬度就是給你的參考值!
最后一步我認為是110+650+17=777。(我是把mainbody設為relative)
有什么理解不到位的地方,歡迎指正!
2016-09-02
希望幕友們不要抱怨太多,不要揪著問題不放,不要想講的有多少問題,要想想從中學習了多少。別管是不是又那么多問題,反正我是學到了。當然有問題也要指出來,這樣子大家才能共同進步,共同學習。
2016-09-02
#mainbody{margin-top:15px;position:relative;}
#left{width:110px; float:left;border:1px solid #999;}
#mid{width:650px;border:1px solid #999;float:left;margin-left:13px;}
#right{border:1px solid #999;position:absolute;top:0;right:0;margin-left:790px;}
#left{width:110px; float:left;border:1px solid #999;}
#mid{width:650px;border:1px solid #999;float:left;margin-left:13px;}
#right{border:1px solid #999;position:absolute;top:0;right:0;margin-left:790px;}
2016-09-01
說實話,討論再多也沒用,你們可以在BOX2加個邊框試試,仔細看就知道BOX2仍然是占據了整行的。也就是說浮動是脫離了文檔流的,但是并沒有脫離文本流,BOX2中的內聯元素會受到影響。浮動會影響下一個元素的說法也不嚴謹,主要是因為浮動脫離了文檔流,而其后元素只是緊挨著前面的元素排列而已(已經浮動的元素不算),屬于標準文檔流的規范。盡信書不如無書,這里并沒有懷疑老師的專業能力,可能按照這樣的理解在工作中也能避免問題,但是我想說的是,編程這種東西,自己多敲敲,不要看小說一樣,敲敲多了就會發現問題的。
2016-09-01