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;}
--------------------------------------------------------------------------
2
--------------------------------------------------------------------------
xhtml:
<div id="header">这里是顶行</div>
<div id="warp">
<div id="column1">这里是第一列</div>
<div id="column2">这里是第二列</div>
<div id="column3">这里是第三列</div>
</div>
<div id="footer">这里是底部一行</div>
CSS:
#header{width:100%; height:auto;}
#wrap{ width:100%; height:auto;}
#column1{float:left;width:30%;background-color: #E1E1E1;}
#column2{float:left;width:30%;background-color: #CCCCCC;}
#column3{float:right;width:40%;background-color: #B7B7B7;}
#footer{width:100%; height:auto;}
--------------------------------------------------------------------------
请问上面的两种方法，除了写法不同以外，在实用方面、效果方面或是其他方面还有什么不同呢？
(顺便问问，在CSS里的方框中的：清除左对齐、清除右对齐、清除两者 各有什么用？我自己搜过这方面的介绍，很可惜的是什么都搜不到，但是又见到很多人都用到清除什么什么的这一项！)
