WEB業界で働く人や興味がある人に役立つ情報サイト“qam（カム）”

投稿者： スーザン
カテゴリー： マークアップ >CSS

今回はCSSを整理整頓してくれる便利ツールのご紹介です。

ProCSSor – Advanced CSS Prettifier

Dreamweaverなどを使用していると、htmlの整形はソースフォーマットである程度きれいになりますが、
CSSの成形ももっと簡単に出来るといいなと思っていて見つけたのがこちらのツールです。

まずはこちらにCSSを流し込みます。（今回は効果をわかりやすくするため、適当に続けて書いています。 ）
そしてoptionボタンを押してCSS表記の設定をします。

そしてこちらを自分のお好みに設定していきます。
下記画像のように項目の上をhoverするとわかりやすく表示がでてくるので、とても便利です。
設定が完了したら、procssボタンを押すだけ！

こんなに簡単にCSSを整えてくれました。
後からインデントなどを入れたい時など、このような便利ツールを利用すると
時間も短縮されるので上手く利用して効率化を計ってくださいね。