怎麼設定min-width我還沒搞懂
稍微說明一下：
html**中 middle部分首先要放在container的最前部分。然後是left,right
1.將三者都 float:left , 再加上乙個position:relative (因為相對定位後面會用到）
2.middle部分 width:100%佔滿
3.此時middle佔滿了，所以要把left拉到最左邊，使用margin-left:-100%
4.這時left拉回來了，但會覆蓋middle內容的左端，要把middle內容拉出來，所以在外圍container加上 padding:0 100px
5.middle內容拉回來了，但left也跟著過來了，所以要還原，就對left使用相對定位 left:-200px 同理，right也要相對定位還原 right:-100px
6.對於right來講，設定margin-left為-100px，此時right的右邊緣正好在middle的右邊緣，覆蓋住middle的內容，由於container有padding為100px，因此再設定right的right=-100px即可
7.到這裡大概就自適應好了。如果想container高度保持一致可以給left middle right都加上min-height:50px，清除浮動的影響還可以在container裡面加入overflow：hidden
div-middle
div-left
'ppp'
rhthd
如果把三欄布局比作乙隻大鳥，可以把container看成是鳥的身體，left和right則是鳥的翅膀。這個布局的實現思路是，先把最重要的身體部分放好，然後再將翅膀移動到適當的地方.
其實跟上邊的聖杯布局差不多的，當然也可以改動一下（自己想想有哪些不同吧）
1.html**中，middle-04要放最前邊，
2.將middle-04，left，right都float:left
3.將middle-04佔滿 width:100%
4.此時middle-04佔滿了，所以要把left拉到最左邊，使用margin-left:-100% 同理 extra使用margin-left:-100px
（這時可以直接繼續上邊聖杯布局的步驟，也可以有所改動）
5.middle-04內容被覆蓋了，除了使用外圍的padding，還可以考慮使用margin。
給middle-04增加乙個內層div-- middle-05, 然後margin:0 100px
6.middle-04正確展示
7.注意middle-05高度是內容的高度哦，可以設定min-height；還可以給container清除浮動
div-middle
div-left
'ppp'
聖杯布局與雙飛翼布局大同小異，網上經典的區別圖是這個
因為聖杯布局是外部的container設定了padding，從而使middle自動的整體縮小
而雙飛翼布局是保持middle不動，在middle內部增加乙個新的div，設定新的div的margin屬性，將內容新增到新的div中。
聖杯布局與雙飛翼布局
聖杯布局和雙飛翼布局都是實現的三欄布局，兩邊的盒子寬度固定，中間盒子自適應，也就是我們常說的固比固布局。它們實現的效果是一樣的，差別在於其實現的思想。聖杯布局的出現是來自於a list part上的一篇文章in search of the holy grail。比起雙飛翼布局，它的起源不是源於對頁面...
雙飛翼布局與聖杯布局
中間層100 佔滿同一高度空間的整層寬度，左右兩層被擠出中間層所在區域時，使用margin left的負值將左右層拉回與中間層同一高度的空間 接著調整左右兩層到指定位置 最後使用margin或padding屬性調整中間層被左右層佔住的顯示區。聖杯布局採用乙個父層包含中間 左右三個子層，設定父層的pa...
聖杯布局與雙飛翼布局
聖杯布局和雙飛翼布局都是兩邊固定，中間內容自適應，當中列要完全顯示，中間列要優先載入 聖杯布局首先要用float搭建完整的布局框架，讓middle，left，right都浮動，給left設定乙個margin left 100 此時left區域上去並靠左，給right設定乙個margin left 2...