CSSフォーマッター

CSS フォーマッターは、圧縮済みまたは空白が不統一なスタイルシートを、インデント、波括弧、セレクター、宣言、メディアクエリ、ネストした at-rule がそろった読みやすい CSS に整えます。

タブまたはスペース、開始波括弧を同じ行に置くか別の行に置くか、セレクター一覧の分割、ルール間の空行を設定できます。文字列値、カスタムプロパティ、コメント、関数、データ URL は、内容を壊すような正規表現置換を使わずに解析します。

「圧縮」はルールを組み替えず、不要な CSS の空白を削除します。「最適化して圧縮」は、互換性のある CSS を結合・再編成してさらに小さくできます。整形と圧縮はブラウザ内で行われます。変数、ネスト、ミックスイン、関数などの SCSS 構文には SCSSフォーマッター を使用してください。

コードフォーマッターのよくある質問

このページでコードを整形するには?

左側のエディターにコードを貼り付けるかファイルを読み込み、必要な設定を選んで「フォーマット」を押します。右側で結果を確認し、コピーまたは保存します。

フォーマッターでエラーになるのはなぜですか?

入力は選択した言語または構文に合っている必要があります。未完成の文、対応していない括弧や引用符、入力と異なる方言やモードを確認してから再度実行してください。

コードフォーマッターはどのように動作しますか?

コードフォーマッターは言語に応じたトークンと入れ子構造を認識し、一貫した規則でインデント、空白、改行を整えます。プログラムをコンパイルしたり実行したりしないため、正しさや安全性の検査にはなりません。

この言語ではどの設定が推奨されますか?

2スペース、同じ行の開始波括弧、セレクターの分割、ルール間の空行が一般的なWeb規約です。インデント、波括弧、セレクターとルールの改行を設定し、整形、空白のみの圧縮、または有効なCSSのより強い最適化を選べます。