<body> <div id="container"> <div id="head"> <div id="top"> </div> <div class="menu"></div> <div class="menu">学院首页</div> <div class="menu">学校概况</div> <div class="menu">组织机构</div> <div class="menu">专业设置</div> <div class="menu">教育教学</div> <div class="menu">招生就业</div> <div class="menu">科学研究</div> <div class="menu">合作交流</div> </div> <div id="main"> <div class="lside"></div> <div class="mside"></div> <div class="rside"></div> </div> <div id="foot"></div> </div> </body>
*{
margin:0px;
}
#container {
background-color: #999999;
width:900px;
height:800px;
margin-left:auto;
margin-right:auto
}
#head{
background-color:#CCCCCC;
width:900px;
height:120px;
margin-left:auto;
margin-right:auto
}
#top{
background-color:#00FF66;
width:900px;
height:100px;
margin-left:auto;
margin-right:auto
}
.menu{
background-color:#FF0000;
width:100px;
height:20px;
float:left
}
#main{
background-color:#9999CC;
width:900px;
height:600px;
margin-left:auto;
margin-right:auto
}
.lside{
background-color:#0000FF;
width:250px;
height:600px;
float:left
}
.mside{
background-color:#FF00FF;
width:400px;
height:600px;
float:left
}
.rside{
background-color:#FFFF00;
width:250px;
height:600px;
float:left
}
#foot{
background-color:#333366;
width:900px;
height:80px;
margin-left:auto;
margin-right:auto
}
<body> <div id="container"> <div id="head"> <div id="top"> <img src="img.jpg.png"width:900px; height:100px;/> </div> <div class="menu"></div> <div class="menu">学院首页</div> <div class="menu">学校概况</div> <div class="menu">组织机构</div> <div class="menu">专业设置</div> <div class="menu">教育教学</div> <div class="menu">招生就业</div> <div class="menu">科学研究</div> <div class="menu">合作交流</div> </div> <div id="main"> <div class="lside"></div> <div class="mside"></div> <div class="rside"></div> </div> <div id="foot"></div> </div> </body>
原文：http://www.cnblogs.com/vactor/p/4421874.html