100% ローカル — データがブラウザの外に出ることはありません

HTMLフォーマッタ|ページの中身をそのまま読める形に整えます

HTMLを字下げし直します。インライン要素は一行のまま残ります。その間の改行は画面上の空白になるからです。読める形になり、見た目のほうは少しも動くことがありません。

高速 プライベート Cookieゼロ
インデント

HTML 入力

HTML 出力

このツールの動作

圧縮された HTML や字下げの崩れた HTML が、読める HTML になります。

<ul><li>a</li><li>b</li></ul>
<ul>
  <li>a</li>
  <li>b</li>
</ul>

入れ子ひとつにつき字下げひとつ。既定は空白二つで、四つにもできます。タグ名も属性もその並びも触りません。これは組版であって、書き換えではありません。

改行はただではない

<p>こんにちは <b>世界</b> また</p>

これは一行のまま残ります。HTML では、行内要素のあいだの空白は文章の一部です。</b> と「また」のあいだで行を折れば、空白をひとつ足したことになります。表示にも、選択にも、コピーした文字列にも現れます。そこで整形ツールはブロック要素(div、p、ul、table など)のまわりで字下げし、行内の連なりはどれだけ長くなってもそのままにします。

HTML 圧縮ツールが逆向きに守っているのと同じ規則で、理由も同じです。表示を変えるものは、整形ではありません。

けっして触らないもの

  • <pre> と <textarea>。 中の空白は書かれたとおりに表示されます。字下げし直せば、ページと入力欄の値を書き換えることになります。
  • <script> と <style>。 中身は JavaScript と CSS であって HTML ではありません。それにはこの場所の JavaScript 整形ツールと CSS 整形ツールを。
  • 属性。 名前も値も引用符も並びも、入ったとおりに出ます。値の中の空白も含めてです。

検証ツールではない

<div><p>x</div>
<div>
  <p>x
</div>

閉じていない <p> は閉じていないまま返ります。整形ツールは渡された文書を読んで並べるだけです。どこでタグを閉じるつもりだったのかを推し量るのは、勘であなたの記述を書き換えることです。文書が整っているかどうかを知るには、検証ツール(W3C のもの)か、解析器が実際に組み立てた木を見せてくれるブラウザーの開発者ツールを。

プライバシー

すべての処理はブラウザ内のJavaScriptだけで完結します。データがアップロードされることはないため、機密情報でも安心して利用でき、オフラインでも動作します。

よくある質問

なぜ同じ行に残るタグがあるのですか。
離すとページが変わるからです。`<span>a</span><span>b</span>` は「ab」と表示されますが、あいだに改行を入れると「a b」になります。行内要素のあいだの空白は内容の一部です。そこで整形ツールはブロック要素のまわりで字下げし、行内の連なりには手を触れません。この場所の HTML 圧縮ツールも、逆向きに同じ規則を守ります。
`<pre>` の中も字下げし直されますか。
いいえ。`<pre>` の中では、空白も改行も書かれたとおりに表示されます。触れば、訪問者が見るものを書き換えることになります。`<textarea>` も同じで、その中身は入力欄の値です。`<script>` と `<style>` の中身はそもそも HTML ではありません。
壊れた HTML を直しますか。
いいえ。これは整形ツールであって、検証ツールでも修復ツールでもありません。`<div><p>x</div>` は `<p>` が開いたまま字下げされて返ります。読み取ったものを並べるだけで、言いたかったことを推し量りはしません。整った結果は、その文書がどう解析されるかについて何も語りません。

関連ツール