＜html＞
＜head＞
＜meta http-equiv=’Content-Type’ content=”text/html; charset=gb2312″ /＞
＜title＞SEO参考:XHTML之经典三行两列布局＜/title＞
＜style type=”text/css”＞
body {
background: #999;
text-align: center;
color: #333;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
#header {
margin-right: auto;
margin-left: auto;
padding: 0px;
width: 776px;
background: #EEE;
height: 60px;
text-align: left;
}
#contain {
margin-left: auto;
margin-right: auto;
width: 776px;
}
#mainbg {
float: left;
padding: 0px;
width: 776px;
background: #60A179;
}
#right {
float: right;
margin: 2px 0px 2px 0px;
padding: 0px;
width: 574px;
background: #ccd2de;
text-align:left;
}
#left {
float: left;
margin: 2px 2px 0px 0px;
padding: 0px;
background: #F2F3F7;
width: 200px;
text-align:left;
}
#footer {
clear: both;
margin-right: auto;
margin-left: auto;
padding: 0px;
width: 776px;
background: #EEE;
height: 60px;
}
.text {margin:0px;padding:20px;}
＜/style＞
＜/head＞
＜body＞
＜div id=”header”＞header＜/div＞
＜div id=”contain”＞
＜div id=”mainbg”＞
＜div id=”right”＞
＜div class=”text”＞＜p＞核心内容＜/p＞＜/div＞
＜/div＞
＜div id=”left”＞
＜div class=”text”＞left＜/div＞
＜/div＞
＜/div＞
＜/div＞
＜div id=”footer”＞footer＜/div＞
＜/body＞
＜/html＞