我不明白怎么mainbody的父元素就被影響了呢？

就是黃色區域的顏色沒了

栄籬

2015-11-29

源自：網頁布局基礎 3-5

關注問題我要回答

394

操作

收起

4 回答

qq_安伊偌拉_0 回答被采納 +3 積分
2015-12-01

子元素不浮動的情況下，父元素不設置高度會被子元素撐起來。但是如果子元素設置了浮動，就會造成父元素坍塌，就是不會把父元素撐起來。清除浮動之后才會撐起父元素。

1 回復有任何疑惑可以回復我~

收起回答

栄籬提問者

看到你這信息一直弄到現在，用工具試了很多次出現了很多現象，記錄現象分析分析現在才明白過來，如果不給父元素設置高度而子元素設置了浮動會塌掉，因為父元素是根據子元素的高度撐開的，如果給父元素設置了高度，那子元素設置了浮動也一樣不會塌

2015-12-01 回復有任何疑惑可以回復我~

栄籬提問者

謝謝你的耐心解答，好人一生平安

2015-12-01 回復有任何疑惑可以回復我~

qq_安伊偌拉_0
2015-12-01

黃色區域在啊

0 回復有任何疑惑可以回復我~

收起回答

栄籬提問者

不好意思，這代碼里的#mainbody是去了浮動的影響的，沒去浮動就不是你上圖的那樣了，就是.left和.right用了float；而#mainbody卻受到了影響。這是為啥呀子。

2015-12-01 回復有任何疑惑可以回復我~

栄籬提問者
2015-11-30

<!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>無標題文檔</title>
<style?type="text/css">
*?{
????margin:0;
	padding:0;
}
#wrap?{
	background:#00C;
	margin:0?auto;
	width:960px;
}
#header?{
	background:#FF3300;
	width:100%;
}
#mainbody?{
	????background:#FC0;
	????width:100%;
????????overflow:hidden;
}
.left?{
	width:800px;
	height:200px;
	background:#000;
	float:left;
}
.right?{
width:140px;
height:500px;
background:#690;
float:right;
}
#footer?{
	background:#639;
	width:100%;
}
</style>
</head>

<body>
<div?id="wrap">
??<div?id="header">頭部</div>
??<div?id="mainbody">
????<div?class="left"></div>
????<div?class="right"></div>
??</div>
??<div?id="footer">版權部分</div>
</div>
</body>
</html>

謝謝大家

0 回復有任何疑惑可以回復我~

收起回答