實際專案開發過程中我們經常會遇到頁面div左右布局的需求：左側 div 固定寬度，右側 div 自適應寬度，填充滿剩餘頁面，下面整理幾種常用的方案
1 左側 div 設定float屬性為left，右側 div 設定margin-left屬性等於或大於左側 div 寬度
1 左側 div 設定 float 屬性為 left，右側 div 設定 margin-left 屬性等於或大於左側 div 寬度實際效果：left
right
2 左側 div 設定float屬性為left，負邊距 100%，右側 div中巢狀乙個 div，頁面內容放入巢狀的 div 中，右側內嵌 div 設定margin-left屬性等於或大於左側 div 寬度
2左側 div 設定 float 屬性為 left，負邊距 100%，右側 div 中巢狀乙個 div，頁面內容放入巢狀的 div 中，右側內嵌 div 設定 margin-left 屬性等於或大於左側 div 寬度實際效果：left
right
3 如果將需求修改為右側固定寬度而左側自適應寬度
3 如果將需求修改為右側固定寬度而左側自適應寬度實際效果：left
right
4 左邊左浮動，右邊overflow：hidden 不過這種方法ie6下不相容
左邊左浮動，右邊overflow：hidden 不過這種方法ie6下不相容實際效果：left
right
5 左邊使用絕對定位，右邊使用margin-left
左邊使用絕對定位，右邊使用margin-left-最外層需要設定相對定位實際效果：left
right
6 左邊絕對定位，右邊也絕對定位
左邊絕對定位，右邊也絕對定位實際效果：left
right
CSS布局 四 左右布局
左邊固定，右邊自適應的兩欄布局。基本樣式 高度有可能會很小，也可能很大。這裡的內容可能比左側高，也可能比左側低。寬度需要自適應。基本的樣式是，兩個div相距20px,左側div寬 120px padding 15px 20px border 1px dashed ff6c60 left right ...
css三欄布局方案整理
日常開發中，經常會用到css三欄布局，現將工作中常用的css 三欄布局整理如下 什麼是三欄布局 三欄布局，顧名思義就是兩邊固定，中間自適應。一 float布局 float布局 最簡單的三欄布局就是利用float進行布局 優勢 簡單 劣勢 中間部分最後載入，內容較多時影響體驗 二 bfc 規則 bfc...
右邊自適應 左右布局 css左右自適應布局
如果有這麼乙個表單需求，前面是乙個名稱，中間是乙個表單，右側是乙個按鈕或者乙個字串。需要自適應布局，名稱為固定長度，右側也是固定，中間部分自適應整個width。先來看看html標籤1 6 年齡歲 首先，我想到的有這麼幾種display，乙個是inline block。於是css就變成這樣1.name...