HTMLフォーマッター
このHTMLフォーマッターでHTMLフラグメントを整形します。マークアップを貼り付けると、div、section、p、ul、tableなどのブロック要素をそれぞれ別の行に配置し、2つのスペースでインデントします。インラインコンテンツの余分な空白をまとめ、インラインのCSSとJavaScriptを整形し、preとtextareaの内容は変更せずに保持します。貼り付けたマークアップ、生成されたマークアップ、圧縮されたマークアップを読みやすくし、レビュー用に整理したいウェブ開発者やデザイナーに最適です。
よくある質問
HTMLフォーマッターはどこで改行するかをどのように判断しますか？
div、section、article、header、footer、nav、main、form、p、h1からh6、ul、ol、table、blockquoteなどのブロックレベルの子要素を含む要素は展開され、各子要素が別々の行に配置されます。インデント幅は2つのスペースです。ブロックレベルの子要素を含まない要素は1行のままです。
HTMLドキュメント全体が1行で返されるのはなぜですか？
html、head、body要素はフォーマッターのルールではブロックレベルタグとして扱われないため、これらで囲まれたドキュメントはdoctypeを除いてインラインのままになります。展開して整形するには、body内のコンテンツ、または作業中のフラグメントを貼り付けてください。
空白はどのように処理されますか？
インラインコンテンツ内の連続するスペース、タブ、改行は1つのスペースにまとめられます。これはブラウザーでの表示と同じです。pre要素とtextarea要素の内容は、空白も含めてそのまま保持されます。
インラインのスクリプトとスタイルは整形されますか？
はい。styleブロックはCSSとして、scriptブロックはJavaScriptとして整形されます。JSONおよびJSON-LD型の場合はJSONとして整形されます。テキストテンプレートなど、ほかの型のスクリプトは記述どおりに保持されます。
空要素のタグはどのように記述されますか？
Self-closingタグ（<br/>など）はスラッシュの前にスペースを入れて<br />のように記述します。スラッシュなしで記述された<img src="a.png">などのvoid要素は、元の形式を維持します。
属性は変更されますか？
いいえ。属性、引用符、属性の順序はすべて記述どおりに保持されます。変更されるのは要素間の空白だけです。
コメントは保持されますか？
はい。HTMLコメントとdoctypeは保持され、それぞれ別の行に配置されます。コメントアウトされたマークアップを含め、内容はそのままコピーされます。
フォーマッターは無効なHTMLを修正しますか？
いいえ。マークアップの検証や修復は行いません。閉じられていないタグも可能な範囲で整形されます。構造上のエラーを見つける必要がある場合は、バリデーターを実行してください。
結果がhtmlのコードフェンスで囲まれるのはなぜですか？
結果はhtmlと指定されたMarkdownコードブロックとして返され、Markdownでハイライト表示されます。.htmlファイルに貼り付ける際は、コードフェンスの間の行をコピーしてください。
どれくらいのHTMLを整形できますか？
1回につき最大5 MBです。これを超える入力はメッセージとともに拒否されます。出力はCode FormatterのHTMLオプションと同じです。