CSS Formatter

使い方

1. 左パネルにスタイルシートを貼り付けます。小さなサンプルが読み込まれているので、まず両方向を試せます。
2. 整形を押すとインデント付きルールブロック、1 行 1 宣言、selector { のレイアウトになります。
3. 圧縮を押すと空白を折り畳み、コメントを除去して本番用の 1 行にします。
4. Copy で結果を取得。入力を編集してどちらの方向でも再実行できます。
5. ステータス行に出力サイズと、圧縮で節約できた文字数が表示されます。

よくある用途

• 配布 CSS を読む —— 圧縮済みフレームワークのファイルを、読んで理解できる形に戻す。
• スタイルシートの公開 —— デプロイ前に圧縮して転送バイトを減らす。
• コードレビュー準備 —— diff の前に整形して、変更行を揃える。
• 生成スタイルの整理 —— デザインツールから出力された CSS を一貫した形に。

よくある質問

Q: 「文字列対応」とは具体的に？ A: シングル・ダブル引用符の中、および url(...) の中は一字一句そのままコピーします。文字列内のセミコロンや波括弧でフォーマッターが誤認することはなく、data URI や空白を含むフォント名も保たれます。

Q: コメントは保持されますか？ A: いいえ。両方向とも /* ... */ コメントを削除します。ライセンス表記も含まれるので、帰属表示が必要なら手動で再追加してください。

Q: 順序の入れ替えや名前の変更はありますか？ A: 一切ありません。ルールと宣言は順序も表記もそのままで、フォーマッターが動かすのは空白と改行だけです。コンパイル結果は意味的に同一です。