三行三列，最简单的DIV+CSS布居代码，谢谢！

Question

如题所述

Answer 1

xhtml:

<div id="header">这里是顶行</div>
<div id="warp">
<div id="column">
<div id="column1">这里是第一列</div>
<div id="column2">这里是第二列</div>
<div class="clear"></div>
</div>
<div id="column3">这里是第三列</div>
<div class="clear"></div>
</div>
<div id="footer">这里是底部一行</div>

CSS:

#header{width:100%; height:auto;}
#wrap{ width:100%; height:auto;}
#column{ float:left; width:60%;}
#column1{ float:left; width:30%;}
#column2{ float:right; width:30%;}
#column3{ float:right; width:40%;}
.clear{ clear:both;}
#footer{width:100%; height:auto;}

Answer 2

xhtml:
<div
id="header">这里是顶行</div>
<div
id="warp">
<div
id="column">
<div
id="column1">这里是第一列</div>
<div
id="column2">这里是第二列</div>
<div
class="clear"></div>
</div>
<div
id="column3">这里是第三列</div>
<div
class="clear"></div>
</div>
<div
id="footer">这里是底部一行</div>
CSS:
#header{width:100%;
height:auto;}
#wrap{
width:100%;
height:auto;}
#column{
float:left;
width:60%;}
#column1{
float:left;
width:30%;}
#column2{
float:right;
width:30%;}
#column3{
float:right;
width:40%;}
.clear{
clear:both;}
#footer{width:100%;
height:auto;}