CSS3－column-count：
使用語法：CSS3
支援瀏覽器：Chrome、Firefox、Safari、Oprea、IE10.0
支援瀏覽器：Chrome、Firefox、Safari、Oprea、IE10.0
CSS3－column-count語法說明：
column-count： 欄位數
column-width：欄位寬度
column-gap： 欄位間距
column-rule：欄位格線
![梅問題－CSS3瀑布流版型編排]()
column-width：欄位寬度
column-gap： 欄位間距
column-rule：欄位格線
CSS3－column-count實作：
#css：
#outbox{ -moz-column-count: 2; -moz-column-gap: 10px; -webkit-column-count: 2; -webkit-column-gap: 10px; column-count: 2; column-gap: 10px; width:734px; margin:0 auto; } .content_box{ width:337px; display: inline-block; font-size:12px; border: 1px dotted #4F4F4F; padding: 10px; margin: 5px 5px 5px 0; overflow:hidden; font-size:15px; line-height: 1.5em; letter-spacing: 1pt; color:#353535; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } |
<div id="outbox"> <div class="content_box">1</div> <div class="content_box">2</div> <div class="content_box">3</div> <div class="content_box">4</div> </div> |
[範例預覽] [範例下載]