【CSS】効率的なコーディング作業02(CSSの圧縮と整形)

CSSを手打ちで書いていくと、癖や非効率な記述や記述揺れなども多く発生します。
そのままでもブラウザでの表示には問題ありませんが、
少しでもコードをキレイにしておきたいものです。

CSSの圧縮や整形を活用することで、
効率的にコードを一定の状態に保てます。

エディターの標準機能や拡張機能などでも実現できますが、
Webサービスで簡単に出来るもの。

探すといくつかありますが、
以下のものが使いやすいと思います。

■CSSの圧縮
https://syncer.jp/css-minifier

■CSSの整形
https://lab.syncer.jp/Tool/CSS-PrettyPrint/

圧縮は全コードを一括ではなく、
ブロックごとにコピペを繰り返していくとメンテナンス性を保つことが出来ます。

整形は全てをまとめてコピペで大丈夫です。

効率的なコーディング作業01(CSSのアウトライン生成)
生成したCSSだと使わない空のセレクタもあるので、これも削除せずそのまま整形すると

div {
}

div {}

こうなるので{}をエディターで検索して
空の行を削除していくと不要なコードを除けます。

関連記事

コメントを残す

*