兩列高度自適應
title
>
<
style
type
="text/css"
>
margin:0
;padding:0
;}#top
#main
.sidebar
.content
.row
#footer
-->
style
>
head
>
<
body
>
<
div
id="container"
>
<
div
id="top"
>
div>
<
div
id="main"
>
<
div
class
="sidebar row"
>
我在左邊
<
br />
我在左邊
<
br />
我在左邊
<
br />
我在左邊
<
br />
我在左邊
<
br />
我在左邊
<
br />
我在左邊
<
br />
我在左邊
<
br />
我在左邊
<
br />
我在左邊
<
br />
我在左邊
<
br />
我在左邊
<
br />
我在左邊
<
br />
我在左邊
<
br />
我在左邊
<
br />
我在左邊
<
br />
我在左邊
<
br />
div>
<
div
class
="content row"
>
我在正文
<
br />
我在正文
<
br />
我在正文
<
br />
我在正文
<
br />
我在正文
<
br />
我在正文
<
br />
我在正文
<
br />
我在正文
<
br />
我在正文
<
br />
我在正文
<
br />
我在正文
<
br />
我在正文
<
br />
我在正文
<
br />
我在正文
<
br />
我在正文
<
br />
我在正文
<
br />
我在正文
<
br />
我在正文
<
br />
我在正文
<
br />
我在正文
<
br />
我在正文
<
br />
我在正文
<
br />
我在正文
<
br />
我在正文
<
br />
<
span
style
="float:right; font-size:0; position:relative; "
>
span
>
div>
div>
<
div
id="footer"
>
div>
div>
body
>
html
>
很多人都會碰到如題的布局問題，解決方案很多，可以用背景圖來填充，或用js來控制，但終不是最佳方案，最好還是從div,css本身來考慮:
以下為三行兩列的的經典模式，還可以演變成多種布局，有待大家修改:
DIV CSS三行兩列經典布局
師阿捷2004年發布在 網頁設計師 上的，乙個非常經典的布局，在ie mozilla和opera瀏覽器中均可以實現居中和高度自適應。完整 如下 在阿捷的 基礎上作了部分修改 title seo參考 xhtml之經典三行兩列布局 title style type text css body heade...
DIV CSS左右列高度自適應問題
我們在用div css布局網頁的時候，必然會遇到左右兩列自適應高度的問題，就是左邊列的背景會隨著右邊列內容的增加也相應的增加高度，下面就教大家div css左右兩列自適應高度的方法。下面給出最終的效果圖 具體 如下所示 左側內容1 右側內容1 右側內容2 右側內容3 說明 其實解決div css左右...
常見左右兩列div css布局技巧整理
2010年08月19日 星期四 上午 10 04 常見的左右兩列div css布局分為以下兩種 一 左右定寬布局 在css分別指定了左右兩列的寬度的情況下，只需要將左邊的div 向左浮動，右邊的div 向右浮動，並清除浮動，即可實現。常用的清除浮動有兩種方式 a 通過在浮動元素的父級元素上新增清除浮...