Softonic

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

Шаг 1 / 3

Вставьте HTML длиной до 100 000 символов. Код не будет выполнен.

Далее: выбрать отступ

Вставьте HTML, выберите отступ в два или четыре пробела и проверьте более читаемую копию. Форматировщик добавляет отступы только там, где структура ясна. Текст вокруг строчных элементов, атрибуты и содержимое особых блоков сохраняются. Если структура неясна, введённый код остаётся без изменений и появляется предупреждение без форматированного результата.

Форматирование HTML за три шага

  1. 1

    Вставьте HTML

    Добавьте разметку, которую хотите привести в порядок. Подойдёт фрагмент или целый документ.

  2. 2

    Выберите отступ

    Выберите два или четыре пробела для вложенных блоков. Меняется расположение строк, а не теги и атрибуты HTML.

  3. 3

    Проверьте и используйте результат

    Сравните результат с исходным кодом, затем скопируйте или скачайте его, если он подходит для вашего проекта. Если появится предупреждение, форматированный результат будет недоступен.

Что меняется и что сохраняется

Форматировщик добавляет отступы там, где структура блоков ясна, не разбивая фразу тегами на отдельные строки. Например, этот компактный фрагмент:

<main><section><h2>Новости</h2><p>Читайте <a href="/news">последние новости</a>.</p></section></main>

может выглядеть так:

<main>
  <section>
    <h2>Новости</h2>
    <p>Читайте <a href="/news">последние новости</a>.</p>
  </section>
</main>

Слова вокруг ссылки и значение href остаются прежними. Выберите четыре пробела, если такой стиль принят в вашем проекте. Инструмент не сортирует атрибуты, не меняет кавычки, не переписывает символьные ссылки, не минифицирует код и не исправляет HTML.

Пробельные символы между элементами могут влиять на CSS, скрипты и шаблоны. Отступы в блоках с ясной структурой могут добавить переносы строк и пробелы между тегами. Проверьте результат, прежде чем использовать его в документе, чувствительном к пробелам. Содержимое <pre>, <code>, <textarea>, <script> и <style> сохраняется в исходном виде.

Если структуру нельзя определить с уверенностью, например из-за некорректной разметки или опущенных закрывающих тегов, введённый код остаётся без изменений и появляется предупреждение. Форматированный результат не создаётся. Предупреждение указывает на ограничение форматирования, а не подтверждает ошибку в HTML. Для проверки соответствия стандарту используйте валидатор HTML.

Часто задаваемые вопросы

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

Форматировщик сохраняет текст и пробелы вокруг строчных элементов. Он может добавить пробельные символы между блоками с ясной структурой, поэтому сравните результат с оригиналом перед использованием в чувствительном к пробелам шаблоне.

Полные блоки pre, code, textarea, script и style остаются в исходном виде. Инструмент не форматирует их содержимое.

Форматирование выполняется в браузере. Для перехода между шагами введённый код сохраняется в хранилище сеанса этой вкладки.

Если из-за опущенного закрывающего тега отступы нельзя расставить с уверенностью, введённый код остаётся без изменений, а инструмент показывает предупреждение без форматированного результата. Добавьте явные закрывающие теги, чтобы получить предсказуемое расположение строк.

Сопутствующие инструменты

Генератор вымышленных телефонных номеров

Создавайте до 50 вымышленных номеров из официально зарезервированных диапазонов пяти стран.

Генератор конфигурации webpack

Создайте webpack.config.js для webpack 5 под чистый JavaScript, React или Vue: TypeScript, Babel, CSS или Sass, изображения, HtmlWebpackPlugin, dev-сервер и команда npm install.

Генератор случайных букв

Генерируйте случайные буквы A-Z. Выберите количество, верхний или нижний регистр либо смешанный вариант для игр, заданий и уроков.

Валидатор XSD

Проверьте XML-документ в соответствии с схемой XSD и выявите несоответствия между элементами и их типами, указав точные номера строк.

Генератор случайных адресов

Создавайте 1–20 похожих на адрес записей для макетов и тестов в трёх упрощённых форматах.

Конвертер размера файлов

Преобразуйте значения между байтами, КБ, МБ, ГБ, ТБ и двоичными единицами IEC (KiB, MiB, GiB, TiB), свободно сочетая десятичные и двоичные единицы.

Инструмент доступен на других языках