求高寬2：1的源代碼及解釋？
老師，第二節(jié)課的后半部分應(yīng)用的自適應(yīng)矩形這里不太懂，能否放出相關(guān)代碼讓我們看看?
Close_0
2016-10-17
3 回答
舉報(bào)
0/150
提交
取消
2016-10-18
<!DOCTYPE?html> <html> <head> ?<meta?charset="UTF-8"> ?<title>Document</title> ?<style> ??.box?{ ???width:?300px; ???background-color:?olive; ???overflow:?hidden;? ??} ??/*?解釋為什么會(huì)有overflow。 ???可能是觸發(fā)BFC，BFC一個(gè)特性是被觸發(fā)BFC的元素不會(huì)影響到外面的元素，所以上下左右四個(gè)margin:?50%;不會(huì)出現(xiàn)在.box外面。那為什么會(huì)是呈現(xiàn)出高寬相等的呢。 ???因?yàn)樵?box內(nèi)部元素的排版按扎正常流的方式，所以會(huì)是的一個(gè)元素自身發(fā)生上下margin重疊現(xiàn)象，所以只有一個(gè)margin:50%; ???*/ ??.box?>?div?{ ???margin:?50%; ??} ?</style> </head> <body> ?<div> ??<div></div> ?</div> </body> </html>2018-01-07
上下margin 一共50% 左右margin 各50% 一共100% 因此撐開成一個(gè)2:1的容器
2016-10-18
上面改正：
那為什么? 不? 會(huì)是呈現(xiàn)出高寬相等的呢
因?yàn)樵?box內(nèi)部元素的排版按照正常流的方式，所以會(huì)是的一個(gè)元素自身發(fā)生上下margin重疊現(xiàn)象，所以只有一個(gè)margin:50%;