課程
/前端開發(fā)
/HTML/CSS
/CSS深入理解之margin
老師,第二節(jié)課的后半部分應用的自適應矩形這里不太懂,能否放出相關(guān)代碼讓我們看看?
2016-10-17
源自:CSS深入理解之margin 2-1
正在回答
<!DOCTYPE?html> <html> <head> ?<meta?charset="UTF-8"> ?<title>Document</title> ?<style> ??.box?{ ???width:?300px; ???background-color:?olive; ???overflow:?hidden;? ??} ??/*?解釋為什么會有overflow。 ???可能是觸發(fā)BFC,BFC一個特性是被觸發(fā)BFC的元素不會影響到外面的元素,所以上下左右四個margin:?50%;不會出現(xiàn)在.box外面。那為什么會是呈現(xiàn)出高寬相等的呢。 ???因為在.box內(nèi)部元素的排版按扎正常流的方式,所以會是的一個元素自身發(fā)生上下margin重疊現(xiàn)象,所以只有一個margin:50%; ???*/ ??.box?>?div?{ ???margin:?50%; ??} ?</style> </head> <body> ?<div> ??<div></div> ?</div> </body> </html>
Audrey_rong
Close_0 提問者
上下margin 一共50% 左右margin 各50% 一共100% 因此撐開成一個2:1的容器
上面改正:
那為什么? 不? 會是呈現(xiàn)出高寬相等的呢
因為在.box內(nèi)部元素的排版按照正常流的方式,所以會是的一個元素自身發(fā)生上下margin重疊現(xiàn)象,所以只有一個margin:50%;
舉報
本CSS教程帶你深入講解CSS的margin屬性,解決你多年困惑
5 回答求高寬2:1的源碼. 我試了問答里的都不太好用
3 回答寬度2:1請教怎么實現(xiàn)?
1 回答沒設置寬高,那藍色區(qū)域是怎么做到的?
1 回答請問他那個下面空隙咱出來的我的為啥沒有?求解釋
2 回答求解求大神照顧
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網(wǎng)安備11010802030151號
購課補貼聯(lián)系客服咨詢優(yōu)惠詳情
慕課網(wǎng)APP您的移動學習伙伴
掃描二維碼關(guān)注慕課網(wǎng)微信公眾號
2016-10-18
2018-01-07
上下margin 一共50% 左右margin 各50% 一共100% 因此撐開成一個2:1的容器
2016-10-18
上面改正:
那為什么? 不? 會是呈現(xiàn)出高寬相等的呢
因為在.box內(nèi)部元素的排版按照正常流的方式,所以會是的一個元素自身發(fā)生上下margin重疊現(xiàn)象,所以只有一個margin:50%;