這一陣子在幫朋友修改 F2blog 的模版時，最痛苦的一件事莫過於研究那一堆 CSS 了。說實話，研究 CSS 沒啥大的難度，把 Dreamweaver 之類的軟體拿出來，他就會把整個 CSS 檔案裡面所有的類別，幫你分門別類的排得好好的給你看，三不五時還會給你一些設定上的導引，方便極了。
可是如果你想要用比對的，手工慢慢改，如果看到原始碼長這個樣子，我不知道您會不會跟我一樣喊「Oh ! My God !!」 然後 Orz 這個表情馬上出來？
在這裡不禁要抱怨一下 F2blog 的開發團隊，怎麼同樣是 layout.css ，怎麼上半部是井然有序，下半部卻是緊緊相依呀 :p
我一直是一個有點潔癖的處女座寶寶，照以前我的作法一定是馬上自己手動一個一個幫他改好，可是如果你有一堆要改，這個原則也是會被改變的 :p，那就有修改到的，再來手動排序吧！
直到那一天，我遇到了 TopStyle ，我終於知道，什麼叫做痛快。
你討厭像是底下這一種亂亂的 CSS 嗎？
你只要用 TopStyle 開啟這個 CSS 檔案，然後從下拉功能表的「Tools」選擇「Style Sweeper」，你馬上就擁有一個非常整齊的 CSS 囉！
這樣看起來，版面是不是清爽多了，改也來也方便多了。
那..... TopStyle 只有這個功能嗎？
那可不，凡舉 CSS 編輯器該有的功能，他都有喔，他的 W3C CSS Validator 和 W3C HTML Validator 還可以做到驗證你的 CSS 是否有合於 W3C 的規範，甚至還可以檢查，在哪一種瀏覽器底下這個語法會有問題。
這是一個好軟體，有需求的朋友可以多嘗試看看 🙂
to be continued ......
相關文章：
Hi Jerome,
看到你這篇介紹CSS,我就很想改改我自己的網頁(Xuite),可是勒,我沒學過CSS,但是我有寫C的底子(工作用),所以想請你介紹幾個網站教CSS比較詳細的(書也可以),謝謝ㄛ ...
to Stone:
我一開始學改模版，是看這一篇的「樂多日誌樣式結構表 v2.0」其實所有的模版的結構，都是類似的方式。
接著你要瞭解一些 CSS 的語法，我也是從網路去找的，看看這兩個網站吧！
http://www.semcase.com/docus/css2/css2.html
http://crow.myweb.hinet.net/css/