剛剛看了一份 W3C CSS3 的文檔，是關(guān)于 Gird （網(wǎng)格？）布局草案的說明。無論它最終實現(xiàn)是否如草案中的描述，但這個功能本身就已經(jīng)足夠吸引人了。
我們看看下面這張圖：
圖中藍色的線不會出現(xiàn)在實際的網(wǎng)頁中。對于這個布局復(fù)雜的三欄網(wǎng)頁來說，如果使用 CSS3 Gird 布局的話，我們只需這樣寫：
body { columns:3; column-gap:0.5in; }
img { float:page top right; width:3gr; }
其中，body 部分聲明頁面為 3 欄，欄間距為 0.5英寸；img 中 float 屬性指明圖片浮動位置為頁面的右上角（CSS3 定位好強大 -__-），而寬度為 3 個欄寬。只需這樣兩行 CSS，我們就可以實現(xiàn)這個復(fù)雜的布局了。真的很神奇。
Gird 布局是好，不過如果你認為它很簡單的話，你就大錯特錯了。看看 w3c 中關(guān)于它的介紹，你會發(fā)現(xiàn)理解它的意義不亞于看懂天書。好在還是個草案，但愿它到了正式版的時候，能夠更加簡單易用點。
Gird 布局應(yīng)用很廣泛，最簡單的例子就是內(nèi)容的分欄顯示。但這個 CSS3 特性目前還沒有任何瀏覽器可以支持它。誰要是能第一個支持它（以及其它 CSS3 草案），那就酷斃了。不知道，最近異常低調(diào)的 IE8，會不會是這第一個吃螃蟹的人呢？
【網(wǎng)站聲明】本站除付費源碼經(jīng)過測試外，其他素材未做測試，不保證完整性，網(wǎng)站上部分源碼僅限學(xué)習(xí)交流，請勿用于商業(yè)用途。如損害你的權(quán)益請聯(lián)系客服QQ：2655101040 給予處理，謝謝支持。