Форматирование HTML

Приведите неряшливый HTML к читаемым отступам — или сожмите его в одну строку — полностью в браузере.

Как пользоваться

  1. Вставьте или наберите HTML. Он форматируется (или минифицируется) по мере ввода — нажимать ничего не нужно.
  2. Переключайте «Форматировать» / «Минифицировать» и выбирайте 2 или 4 пробела. В режиме минификации управление отступом недоступно.
  3. Блочные элементы получают один уровень отступа на глубину, по одному на строку. Строчное содержимое (текст вместе с <a> или <b>) сохраняется ровно как написано.
  4. Пустые элементы (<br>, <img>, <input>…) не требуют закрывающего тега и сохраняются дословно, включая необязательный />.
  5. Элементы сырого текста (<script>, <style>, <textarea>, <title>, <pre>) копируются символ в символ; внутри них ничего не разбирается и не переформатируется.

Пример

Ввод

<!DOCTYPE html><html><head><meta charset="utf-8"><title>Демо</title></head><body><div class="card"><h1>Привет</h1><p>Привет, <b>мир</b></p><ul><li>один</li><li>два</li></ul></div><script>const x=1;</script></body></html>

Вывод

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Демо</title>
  </head>
  <body>
    <div class="card">
      <h1>Привет</h1>
      <p>Привет, <b>мир</b></p>
      <ul>
        <li>один</li>
        <li>два</li>
      </ul>
    </div>
    <script>const x=1;</script>
  </body>
</html>

Строчное содержимое и содержимое <script>/<style> сохраняются дословно; <meta> — пустой элемент, он остаётся как написан.

Ограничения

  • Только структура: парность тегов, пустые элементы, частые неявные закрытия (li/td/tr/dt/dd/option/p/head) и вложенность. Проверки DTD/Schema нет.
  • Встроенные JavaScript и CSS не форматируются — содержимое <script>/<style> остаётся как есть. (Для них используйте форматтер кода.)
  • Не все необязательные закрывающие теги HTML5 выводятся; действительно неверная вложенность сообщается со строкой и столбцом.
  • Строчное и смешанное содержимое намеренно не переотступается. Содержимое <pre>/<textarea>/<title> сохраняется дословно.
  • Нет загрузки файлов, параметров URL, истории и аккаунта. Ввод никогда не покидает ваш браузер.

Другие форматтеры и текстовые инструменты из этого набора.