2010/07/12

幾個 CSS3 排版用語法

維基百科:互助客棧/技術/存檔/2010年5月 上面挖到寶,找到幾個 CSS 語法可以讓過長的列表自動分欄。

-moz-column-count: 3;
-webkit-column-count: 3;
column-count: 3;
-moz-column-width: auto;
-webkit-column-width: auto;
column-width: auto;
-moz-column-gap: 0;
-webkit-column-gap: 0;
column-gap: 0;
-moz-column-rule: ;
-webkit-column-rule: ;
column-rule: ;

效果如下:
  • A
  • B
  • C
  • D
  • E
  • F
  • G
  • H
  • I

看不到效果可能是因為使用 IE 的關係,目前 Firefox 和 Chromium 都有支援這個語法,Opera 和 Safari 我就不太確定了。

如果還在使用 IE,請容我說一句話:使用 IE 的死亡率比新流感更高!請改用免費又安全的 Firefox 或是其他瀏覽器!

沒有留言:

張貼留言