a.使用浮動布局
html結構如下
left
right
center
//此處注意要先渲染左、右浮動的元素才到中間的元素。元素浮動後剩餘兄弟塊級元素會佔滿父元素的寬度
html結構如下
left
right
center
//和浮動布局同理，先渲染左右元素，使其定位在父元素的左右兩端，剩餘的中間元素佔滿父元素剩餘寬度。
將父元素display:table，子元素display:table-cell，會將它變為行內塊。
這種布局方式的優點是相容性好。
left
center
right
父元素display：flex子元素會全部並列在一排。
子元素中flex:n的寬度會將父元素的寬度/n
如flex:1，寬度就等於父元素高度。
彈性布局的缺點是相容性不高，目前ie瀏覽器無法使用彈性布局
left
center
right
父元素display:grid;
grid-templatecolumns:100px auto 100px;
依次為第乙個子元素寬100px 第二個自適應 第三個100px;
網格布局的優點是極為簡便，直接通過父元素樣式決定，缺點是相容性不高。
left
center
right
三列布局（左右固定寬度，中間自適應）
無標題文件title type text css left right middle style head id left div id right div id middle div body html 自己試了好幾次，但是右邊 div 總是另起一行排列，後來發現原來 html 中要先列出 lef...
左右固定中間自適應布局
1.這是三欄布局中間部分 2.這是三欄布局中間部分 1.這是三欄布局中間部分 2.這是三欄布局中間部分 其實稍微想一下就能想到這個flex布局，article的display設定為flex，左右div寬度固定，中間div的flex屬性設定為1，讓其自動填充剩下的空間 1.這是三欄布局中間部分 2.這...
高度固定，左右寬度300，中間自適應
方法1 浮動 左邊盒子左浮動，寬度為300px,右邊盒子右浮動，寬度為300px,給div設定乙個min height 100px,中間盒子設定margin 0 300px.方法2 定位 整個div都用絕對定位，左邊盒子left 0,width 300px 右邊盒子right 0,width 300...