DIV三行两列
现在的DIV+CSS越来越受到搜索引擎的喜爱，也受到了网页设计人员的喜爱，但也会由于一个CSS文件的过于庞大，如果不小心丢失那将会是惨目忍睹的网页。由于其修改方便，也令我们总是迷恋。总想打一个可以很好的来控制DIV布局的软件，这样我们就可以不手写 CSS，多好，虽说有，但一直没有找到，我们可以先来看下面的DIV三行两列的布局。
＜body＞
＜div id=”header”＞header＜/div＞
＜div id=”contain”＞
＜div id=”mainbg”＞
＜div id=”right”＞
＜div class=”text”＞content＜/div＞
＜/div＞
＜div id=”left”＞
＜div class=”text”＞left＜/div＞
＜/div＞
＜/div＞
＜/div＞
＜div id=”footer”＞footer＜/div＞
＜/body＞
上面基本完成了三行两行，开头，内容（左、右），页脚的布局，下面我们可调下下面的CSS，就OK了，把下面的CSS保存为了一个单独的CSS文件，就好。也可以用STYLE写在同一个网页中，这样就比较麻烦了，如其它页面想用的的时候，就不好了，不如做为一个外部的文件来的好。
body {
text-align: center; color: #333; font-family: Verdana, Arial, Helvetica, sans-serif;
}
#header {
margin-right: auto; margin-left: auto; padding: 0px; width: 776px; height: 50 px; 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;
}
这样基本的一个三行两列的布局就构成了。