CSScombはスタイルシートのプロパティを並べ替えるオンラインまたはテキストエディタ用プラグインです。

スタイルシートは冗長的に書いたり、多少ミスして書いてもうまくWebブラウザが解釈してくれる分、更新を重ねていくと徐々に見づらくなっていきます。そこで定期的にCSScombを使って奇麗な並び順に戻してみましょう。


トップページです。


ソートしました。右側に出ているのは設定です。


webkit-border-radiusなどのプロパティが上に上がっています。

CSScombはソートを変更するだけなので行数やサイズは変わらないように見えますが、複数行をコメントアウトしていたりすると変わるケースもあるようです。オンライン版の他、Sublime Text 2/Textmate/Coda/Espresso 2/IntelliJIDEA/WebStorm/PyCharm/Notepad++/Vimに対応したプラグインが提供されています。

CSScombはPHP製(Web版)、各種テキストエディタ用のオープンソース・ソフトウェア(MIT License)です。

MOONGIFTはこう見る

Webデザイナーは個々人で見やすいスタイルシートの記述テクニックを持っていると思われます。しかしナレッジが個人に寄ってしまうので、途中からプロジェクトに加わったりすると全体を把握するのがとても困難になるケースも多いようです。HTMLのクラスの付け方など、まだデザインとHTML構造との分離は完全ではありません。

それだけに記述テクニックは個人の裁量ではなく、デファクトと呼べるようなフレームワークに沿って行ったり、スタンダードな手法を使っていくのが良いと考えられます。LESSをはじめCSSを生成するタイプのライブラリを使っていくのも統一感を出す意味で良いのではないでしょうか。

The Greatest tool for sorting CSS properties in specific order

miripiruni/CSScomb