<!DOCTYPE?html>
<html>
????<head>
????????<title>ceshi</title>
????????<style>
????????*{
????????????margin:?0;
????????????padding:?0;
????????}
????????#wrap{
????????????width:1002px;
????????????background:gray;
????????}
????????.header{
????????????height:?120px;
????????}
????????.main{
????????????
????????????background:?green;
????????}
????????.main?.left{
????????????width:700px;
????????????height:?600px;
????????????float:?left;
????????????background:?black;
????????}
????????.main?.right{
????????????width:302px;
????????????height:?600px;
????????????float:?left;
????????????background:?yellow;
????????}
????????.footer{
????????????height:?120px;
????????????background:?blue;
????????}
????????</style>
????</head>
????<body>
????????<div?id="wrap">
????????????<div?class="header"></div>
????????????<div?class="main">
????????????????<div?class="left"></div>
????????????????<div?class="right"></div>
????????????</div>
????????????<div?class="footer"></div>
????????</div>
????</body>
</html>
1 回答
已采納
剛毅87
TA貢獻(xiàn)345條經(jīng)驗 獲得超309個贊
因為 maindiv 沒有設(shè)置寬高,所以他的高度是由內(nèi)容撐開的,而他里面兩個 div 都設(shè)置浮動,脫離了文檔流,不占空間,所以 maindiv 的高度默認(rèn)為0,因此 footer 會貼著 header,?
實際上 main 就在他倆中間,只是沒顯示出來,給 main 設(shè)置個邊框都可以看到效果
添加回答
舉報
0/150
提交
取消