左側固定，右側自適應
左邊寫死寬高，並浮動，右邊高度寫死，但是不能設定寬度，用margin-left去留出左邊盒子的寬度，右邊盒子會自動內減，右側盒子不會被撐大。
乙個沒有width屬性的標準流盒子，設定margin和padding並不會撐大盒子的實際寬度，相當於設定了box-sizing：border-box；
左側自適應，右側固定
設定第乙個盒子右浮動，相當於右側盒子，第二個盒子高度固定，寬度不寫，設定margin-right，盒子自動內減
注意，不可先寫左側的固定盒子，否則，左側盒子會佔一行，右側盒子再浮動，是在下一行浮動
聖杯布局：
左右固定，中間自適應
中間固定，兩邊自適應
先寫兩側需要浮動的，設定寬度50%，左右浮動，設定padding，再設定盒子內減，中間的盒子寫死寬高，要絕對定位設定居中，否則內容會下來，因為浮動的盒子不會蓋住標準流的內容
CSS經典布局 聖杯布局
廢話不多說，先上全部的 body container container column center left right footer ie6 fix html left 首先就是建立大體的布局，header footer container 給 container 乙個預設的padding le...
CSS布局經典問題
brianway.github.io 2017 05 18 css layout classical problems 本文主要對 css 布局中常見的經典問題進行簡單說明，並提供相關解決方案的參考鏈結，涉及到三欄式布局，負 margin，清除浮動，居中布局，響應式設計，flexbox 布局，等等。...
經典css布局案例
經典css布局案例 1 css浮動 包括 塊元素和行內元素 display屬性 浮動 float 塊元素和行內元素的區別是 塊元素有大小，而行內元素沒有 塊元素預設單獨佔一行，行內元素都在同一行。既然塊元素和行內元素有各自的特點，當我們需要來回切換他們的模式時，該怎麼做呢？例如想要塊元素都按行排列。...