猿问

四个div在同一个布局环境BFC,在哪个bfc中啊?

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
<style> 
  * { padding:0; margin:0; }
  #red, #yellow, #orange, #green { width:100px; height:100px; float:left; } 
  #red { background-color:red; }
  #yellow { background-color:yellow; } 
  #orange { background-color:orange; } 
  #green { background-color:green; }
</style>
</head>
<body>
  <div id="c1">
    <div id="red">
    </div>
    <div id="yellow">
    </div>
  </div>
  <div id="c2">
    <div id="orange">
    </div>
    <div id="green">
    </div>
  </div>
  <p>Here is the text!</p>
</body>
</html>

该段代码本意要形成两行两列的布局,但是由于#red,#yellow,#orange,#green四个div在同一个布局环境BFC中,因此虽然它们位于两个不同的div(#c1和#c2)中,但仍然不会换行,而是一行四列的排列。

我来问:四个div在同一个布局环境BFC,在哪个bfc中啊?4个浮动的div是4个bfc环境?

慧女神
浏览 1802回答 1
1回答

Walk_

拙见:问题一:四个div不处于同一个BFC中。问题二:4个浮动的div是4个bfc环境。
随时随地看视频慕课网APP
我要回答