<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript">
</script>
<style type="text/css">
/* 清除默认样式*/
*{
margin: 0px;
padding: 0px;
}
.header{
width: 1000px;
height: 150px;
background-color: antiquewhite;
margin: 0 auto;
}
.content{
width: 1000px;
height: 300px;
background-color: cornflowerblue;
margin: 10px auto;
}
.left{
width: 200px;
height: 100%;
background-color: burlywood;
float: left;
}
.center{
width: 580px;
height: 100%;
background-color: yellow;
float: left;
margin: 0 10px;
}
.right{
width: 200px;
height: 100%;
background-color: pink;
float: left;
}
.footer{
width: 1000px;
height: 150px;
background-color: darkgrey;
margin: 0 auto;
}
.up{
height: 135px;
width: 560px;
background-color: greenyellow;
margin: 10px 10px;
}
.down{
height: 135px;
width: 560px;
background-color: wheat;
margin: 10px 10px;
float: left;
}
.l{
width: 100px;
height: 115px;
float: left;
background-color: palevioletred;
margin: 10px 10px 10px 10px;
}
.r{
width: 430px;
height: 115px;
float: left;
background-color: skyblue;
margin: 10px 10px 10px 0px;
}
</style>
</head>
<body>
<!-- 头部div -->
<div class="header"></div>
<div class="content">
<div class="left"></div>
<div class="center">
<div class="up"></div>
<div class="down">
<div class="l"></div>
<div class="r"></div>
</div>
</div>
<div class="right"></div>
</div>
<div class="footer"></div>
<!-- 主体内容div -->
<!-- 底部信息div -->
</body>
</html>
