快速設計 CSS 版型 的 YUI CSS Grid Builder

一般要設計頁面版型, 如欄位數, 側邊欄等, 多少要運用CSS 語法或是使用 html table的方式. 如果不熟悉CSS, 就考慮 Yahoo 提供的 CSS Grid 工具來設計介面吧!

只要調整欄位數, 欄寬, 就可以自動產生語法.





YUI:CSS Grid Builder 提供一個線上快速產生版型語法的介面, 即使不懂 CSS 語法, 也可以操作.

在Body Columns, 有幾種選項 可以選擇, 如左邊側邊欄, 右邊側邊欄.


輸入header, footer的文字及顯示位置


利用 "add another row"的方式, 可創建出多欄的樣式.


設定好之後, 按 show code, 就可以顯示程式碼了!


另外, Body的寬度, 也可以自訂哦!


YUI CSS Grid Builder : http://developer.yahoo.com/yui/grids/builder/

相關文章 :