# CSSフォーマッター

このCSSフォーマッターで、圧縮されたスタイルシートや乱雑なスタイルシートを整形します。CSSを貼り付けると、解析して各ルールをセレクターごとに1行で出力します。宣言は1行につき1つとし、2つのスペースでインデントします。各コロンの後にはスペースを入れ、コンビネーターの間隔も整えます。メディアクエリなどのネストされたat-ruleにも対応します。解析エラーは報告されます。あらゆるソースのスタイルシートを読み、デバッグし、レビューするウェブ開発者やデザイナーに最適です。

## よくある質問

### CSSフォーマッターはどのように動作しますか？

スタイルシートをルール、宣言、at-ruleに解析し、一貫したレイアウトで再出力します。CSSを解析するため、出力にはスタイルシートの実際の構造が反映されます。

### 整形されたCSSはどのような見た目ですか？

各ルールはセレクターと開き波括弧で始まり、各宣言は2つのスペースでインデントして1行ずつ記述し、コロンの後にはスペースを入れ、閉じ波括弧は独立した行に置きます。セレクターのリストはカンマとスペースでつなぎ、> や ~ などの結合子の前後にはスペースを入れます。

### メディアクエリやその他のアットルールにも対応していますか？

はい、@media、@supportsなどのブロック内のルールは、ネストしてインデントされます。@importなどの文は1行にまとめられ、url()の値は引用符で囲まれます。

### 無効なCSSの場合はどうなりますか？

たとえば波括弧が欠けているなど、パーサーがスタイルシートを読み取れない場合、ツールは処理を停止し、行番号とともにパーサーのメッセージを表示します。報告された箇所を修正して、もう一度フォーマットしてください。

### コメントは保持されますか？

はい、ルール間と宣言間のどちらのコメントも保持されます。各コメントは、周囲のコードと同じインデントで独立した行に配置されます。

### カスタムプロパティに対応していますか？

はい、--brand-colorなどのカスタムプロパティも、ほかの宣言と同じようにフォーマットされます。var(--brand-color)などの参照は、記述どおりに保持されます。

### ここでSCSSやLessをフォーマットできますか？

いいえ、このページで扱えるのはプレーンなCSSのみです。プリプロセッサーのネストされたルールや変数は受け付けられない場合があります。それらのファイルにはSCSS FormatterまたはLess Formatterをお使いください。

### インデントや波括弧のスタイルを変更できますか？

いいえ、フォーマッターにオプションはなく、常に2つのスペースを使い、開き波括弧をセレクターと同じ行に配置します。これにより、すべてのスタイルシートで一貫した結果が得られます。

### 結果がcssのコードフェンスで囲まれているのはなぜですか？

出力はcssと指定されたMarkdownコードブロックとして返されるため、Markdownでシンタックスハイライトされます。.cssファイルに使うには、フェンスの間の行をコピーしてください。

### スタイルシートのサイズ上限はどれくらいですか？

1回の実行につき最大5 MBです。これより大きい入力はメッセージとともに拒否されます。出力はCode FormatterのCSSオプションと同じです。

ここに広告を掲載しませんか？

[メールでお問い合わせ](mailto:hi@dennn.is?subject=OneClick%20Pro%E3%81%A7%E3%81%AE%E5%BA%83%E5%91%8A%E6%8E%B2%E8%BC%89)

[広告 WordPress向けのエージェント対応プラグインスイート。](https://sleekwp.com/?ref=oneclickpro)