1、在一個頁面中的基本佈局元素為：
<div id=container>
<div id=header ></div>
<div id=content>
<div id=slidebar></div>
<div id=pagecontent></div>
</div>
<div id=footer></div>
</div>
2、如果用css將一個頁面分為上中下，而中又分為左右；
<div id=container>
<div id=header style="position:relative; width:100%; height:100px; border-bottom-style:solid; border-bottom-width:1px; border-bottom-color:#00FF00 "></div>
<div id=content style="clear:both">
<div id=slidebar style=" float:left;width:20%; height:400px; border-right-color:#00FF00; border-right-style:solid; border-right-width:1px"></div>
<div id=pagecontent style="float:left">
</div>
<div id=footer style=" float:left; height:100px; width:100%; border-top-color:#00FF00; border-top-style:solid; border-top-width:1px"></div>
</div>
3、如何將多個小控制元件排成一排？
其實很簡單，比如現在有5個按鈕，要將這些按鈕排成一排，只要作如下處理就可以了；
<div class=button style=" float:left"><input type="button" value="button1"/></div>
<div class=button style=" float:left"><input type="button" value="button1"/></div>
<div class=button style=" float:left"><input type="button" value="button1"/></div>
<div class=button style=" float:left"><input type="button" value="button1"/></div>
<div class=button style=" float:left"><input type="button" value="button1"/></div>
其實就是將每個控制元件的float都設定為left就可以了；
4、如果不想讓這些東西都排成一排，怎麼辦？
那也很簡單，只要設定他們的clear:both就可以了；
總的來說，就是要充分利用float和clear；還有就是widht,height這幾個屬性，就能夠很好的對介面元素進行定位；