HTMLフォーマッター
要素、属性、テキスト、コメント、文書構造を保ったまま HTML を読みやすく整形します。
Make HTML structure easier to inspect
圧縮された HTML は入れ子、属性、テキスト、コメントが一行に隠れます。このツールは確認しやすいレイアウトを表示します。
整形は表示を変えるだけで、HTML の妥当性、アクセシビリティ、安全性、ブラウザ互換性を証明しません。元のファイルと diff を保存してください。
入れ子要素、属性、テキスト、コメント、エンティティを含む例を使い、必要な検査を実行します。
Formatting is not HTML validation
HTML は要素、属性、テキスト、コメント、宣言の木構造です。インデントで親子関係と終了タグを追いやすくできます。
フォーマッタは空白を整理しますが、標準、アクセシビリティ、セキュリティ、テンプレート規則、実行動作を検証しません。
ブラウザは不正なマークアップを異なる方法で復旧することがあります。void 要素、オプションタグ、script、style、entity を確認してください。
HTML source の 要素 階層 属性 値 テキスト ノード コメント entity script style 空白 semantics accessibility browser behavior build 結果を確認します。 source と formatted output を比較し parser、validator、template、encoding、order、focus、ARIA、security、privacy、deployment 前のテストを確認します。 1
HTML source の 要素 階層 属性 値 テキスト ノード コメント entity script style 空白 semantics accessibility browser behavior build 結果を確認します。 source と formatted output を比較し parser、validator、template、encoding、order、focus、ARIA、security、privacy、deployment 前のテストを確認します。 2
HTML source の 要素 階層 属性 値 テキスト ノード コメント entity script style 空白 semantics accessibility browser behavior build 結果を確認します。 source と formatted output を比較し parser、validator、template、encoding、order、focus、ARIA、security、privacy、deployment 前のテストを確認します。 3
HTML source の 要素 階層 属性 値 テキスト ノード コメント entity script style 空白 semantics accessibility browser behavior build 結果を確認します。 source と formatted output を比較し parser、validator、template、encoding、order、focus、ARIA、security、privacy、deployment 前のテストを確認します。 4
HTML source の 要素 階層 属性 値 テキスト ノード コメント entity script style 空白 semantics accessibility browser behavior build 結果を確認します。 source と formatted output を比較し parser、validator、template、encoding、order、focus、ARIA、security、privacy、deployment 前のテストを確認します。 5
HTML source の 要素 階層 属性 値 テキスト ノード コメント entity script style 空白 semantics accessibility browser behavior build 結果を確認します。 source と formatted output を比較し parser、validator、template、encoding、order、focus、ARIA、security、privacy、deployment 前のテストを確認します。 6
HTML source の 要素 階層 属性 値 テキスト ノード コメント entity script style 空白 semantics accessibility browser behavior build 結果を確認します。 source と formatted output を比較し parser、validator、template、encoding、order、focus、ARIA、security、privacy、deployment 前のテストを確認します。 7
HTML source の 要素 階層 属性 値 テキスト ノード コメント entity script style 空白 semantics accessibility browser behavior build 結果を確認します。 source と formatted output を比較し parser、validator、template、encoding、order、focus、ARIA、security、privacy、deployment 前のテストを確認します。 8
source formatted output parser validator template encoding structure attributes text comments entities browser accessibility security privacy deployment review test 9
source formatted output parser validator template encoding structure attributes text comments entities browser accessibility security privacy deployment review test 10
source formatted output parser validator template encoding structure attributes text comments entities browser accessibility security privacy deployment review test 11
How to format HTML
- 完全な HTML 文書または対応するフラグメントを入力します。
- 入れ子、タグ、属性、テキスト、コメント、script、style を確認します。
- 値、entity、テキスト、順序を元の入力と比較します。
- HTML、アクセシビリティ、テンプレート、ブラウザのテストを実行します。
- サンプルから認証情報と個人情報を削除します。
Formatting method
- 要素、属性、テキスト、コメント、宣言、埋め込み領域を読み取ります。
要素、属性、テキスト、コメント、宣言、埋め込み領域を読み取ります。
- 改行とインデントを追加し、入れ子と兄弟順を見やすくします。
改行とインデントを追加し、入れ子と兄弟順を見やすくします。
- 元の値、テキスト、コメント、entity、script、style を保持します。
元の値、テキスト、コメント、entity、script、style を保持します。
parser の復旧、オプションタグ、空白、埋め込み言語、正確なエラーは実際の engine で確認してください。
Read the formatted result
成功結果は入力 HTML の読みやすい配置です。構造、属性、テキスト、コメント、entity、script を元と照合します。
失敗してもブラウザの復旧方法や正確な parser エラーは確定しません。
validator、アクセシビリティ、build の問題は別契約です。整形は意味や安全性を追加しません。
よくある間違い
インデントを検証と考えると属性不足、無効な入れ子、アクセシビリティ問題を見落とします。
entity、属性、空白に依存するテキストを変更すると動作が変わります。
ブラウザの復旧が formatter と同じだと仮定しないでください。
私的な template、token、ユーザーデータを貼らないでください。
制限と特殊なケース
この機能は HTML の表示整形です。標準、アクセシビリティ、安全性、互換性、template、minify を保証しません。
オプションタグ、void 要素、CSS、JavaScript、entity、大きな文書は対象ツールで試験してください。
ポリシーが許可しない機密 markup は入力しないでください。
Examples
整形は HTML を検証しますか？
整形は HTML を検証しますか？
完全な HTML 文書または対応するフラグメントを入力します。
成功結果は入力 HTML の読みやすい配置です。構造、属性、テキスト、コメント、entity、script を元と照合します。
ページの動作は変わりますか？
ページの動作は変わりますか？
入れ子、タグ、属性、テキスト、コメント、script、style を確認します。
失敗してもブラウザの復旧方法や正確な parser エラーは確定しません。
属性は保持されますか？
属性は保持されますか？
値、entity、テキスト、順序を元の入力と比較します。
validator、アクセシビリティ、build の問題は別契約です。整形は意味や安全性を追加しません。
コメントは保持されますか？
コメントは保持されますか？
HTML、アクセシビリティ、テンプレート、ブラウザのテストを実行します。
成功結果は入力 HTML の読みやすい配置です。構造、属性、テキスト、コメント、entity、script を元と照合します。
fragment を整形できますか？
fragment を整形できますか？
サンプルから認証情報と個人情報を削除します。
失敗してもブラウザの復旧方法や正確な parser エラーは確定しません。
アクセシビリティは向上しますか？
アクセシビリティは向上しますか？
完全な HTML 文書または対応するフラグメントを入力します。
validator、アクセシビリティ、build の問題は別契約です。整形は意味や安全性を追加しません。
Frequently asked questions
整形は HTML を検証しますか？
いいえ。HTML validator、アクセシビリティ、ブラウザ、template の検査を使います。
ページの動作は変わりますか？
対応入力では表示空白だけが変わる想定ですが、比較とテストを行ってください。
属性は保持されますか？
例は名前と値を保持します。重要な URL、class、id は diff で確認します。
コメントは保持されますか？
例はコメントを保持します。実際の入力で確認してください。
fragment を整形できますか？
完全な文書または対応 fragment を使います。周囲の文脈に依存する場合があります。
アクセシビリティは向上しますか？
いいえ。意味、focus、contrast、ARIA は専用検査が必要です。
不正な HTML を修復しますか？
自動修復を想定せず、元を修正して検証してください。
整形後は何をしますか？
diff を確認し、validator とアクセシビリティ検査を実行し、対象ブラウザで表示します。