一、float+margin
id="content">
id="aside">側邊欄固定寬度div>
id="main">主內容欄自適應寬度div>
div>
#content
#main
#aside
可任意調換位置
父元素自適應高度
缺點：
不支援主內容優先顯示
二、absolute+margin
id="content">
id="main">主內容欄自適應寬度div>
id="aside">側邊欄固定寬度div>
div>
#content
#aside
#main
優點：可任意調換位置
可主內容優先顯示
缺點：側邊無法撐開父元素的高度，會溢位父元素區域。
三、float+-margin
"content">
"main">主內容欄自適應寬度
"aside">側邊欄固定寬度
/*左定*/
#content
#main
#aside
/*右定*/
#content
#aside
兩列布局 多列布局
用css html編寫乙個兩列布局的網頁，要求右側寬度為200px，左側自動擴充套件 container left div right div div 利用浮動float margin container left right利用彈性盒子來寫 container left right利用定位posi...
兩列布局 三列適應布局 兩列等高適應布局。
一.兩列布局 左側定寬 右側自適應。四種方法 flex position float和負外邊距 外邊距 1.使用flex.右側自適應區塊 左側定寬200px區塊 2.使用position，考慮了頁面優化，右側區域先載入。右側自適應區塊 左側定寬200px區塊 3.利用float和負外邊距 這裡的10...
頁面布局 兩列布局
left right right css left right簡單的布局方法，左側設定浮動，右側設定margin left 避免環繞左側 的布局方法 left right right css left right fix right通過在html檔案的right上套上一層right fix，然後對r...