html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
body{
background-color: #FF9900;
}
#d1{
width: 90%;
height: 50px;
background-color: #8B0000;
margin: 0px auto;
text-align: center;
}
#d2{
width: 100%;
height: 400px;
background-color: #00008B;
margin: 0px auto;
text-align: center;
}
#d3{
width: 100%;
height: 400px;
background-color: #00BFFF;
margin: 0px auto;
text-align: center;
}
#d4{
width: 30%;
height: 400px;
background-color: #C0C6CB;
margin: 0px auto;
text-align: center;
float:left;
}
#d5{
width: 65%;
height: 400px;
border: solid 10px red;
box-sizing: border-box;
background-color: #C0C6CB;
margin: 0px;
text-align: center;
float:left;
}
#d6{
width: 60%;
height: 60%;
box-sizing: border-box;
background-color: #008000;
margin: 0px;
text-align: center;
float:left;
}
#d7{
width: 39%;
height: 60%;
margin: 10px 0 0 0;
box-sizing: border-box;
background-color: #8B0000;
margin: 0px;
text-align: center;
float:right;
}
#d8{
width: 100%;
height: 34%;
box-sizing: border-box;
background-color: #87CEEB;
margin: 10px 0px;
text-align: center;
float:right;
}
#d9{
width: 100%;
height: 50px;
background-color: #008000;
text-align: center;
}
</style>
</head>
<body>
<div id=d1>
导航
</div>
<div id=d2>
广告
</div>
<div id=d3>
<div id=d4>
左盒
</div>
<div id=d5>
<div id=d6>新闻</div>
<div id=d7>搜索</div>
<div id=d8>案例展示</div>
</div>
</div>
<div id=d9>尾部</div>
</body>
</html>