利用css控制網頁的左右排列

 在網站的內容頁中，我在左上角放置了300*250的廣告，利用的是css的浮動<div style=”float:left;margin-right:15px;”>，由於css的特性，這樣設置後，當文章的高度超過了250像素時，文章自動移動到廣告的下面去了，而不是左右兩列分開，如何左右分開呢？那麼我們就給這個div加個縱向的高度<div style=”float:left;margin-right:15px;height:300px”>這個高度值設為多少，根據網頁的需要自己調整。

其實，這個類似於用css來畫一個矩形而已，需要設置邊框顏色和寬度的，看下面的示例：

畫矩形：<div style=”width:300px;height:150px;border:1px solid #000″></div>

畫垂直線（以上例 放中間）：<div style=”width:300px;height:150px;border:1px solid #000″><div style=”width:150px;height:150px;border-right:1px solid #000″></div></div>