открыть файл drag & drop · до 5 МБ (Pro: 100 МБ)

— вставьте html // client-only

// результат появится здесь

// о инструменте

HTML-форматтер парсит разметку и восстанавливает её с единообразными отступами, делая вложенность элементов сразу понятной. Обрабатывает void-элементы (br, img, input), строчные и блочные элементы, блоки с сырым контентом (script, style, pre) и HTML-комментарии.

// когда использовать

Распаковать минифицированный HTML со страницы для изучения структуры
Почистить HTML из WYSIWYG-редактора или шаблонизатора
Минифицировать HTML-шаблоны для продакшн-сборки
Просмотреть структуру вложенности сложного компонента или email-шаблона

// faq

Влияет ли форматирование на рендеринг страницы?

Для блочных элементов — нет: пробелы между ними браузер игнорирует. Для строчных элементов (span, a, em) добавление пробелов может привести к маленьким зазорам. Форматтер оставляет строчные элементы на одной строке, чтобы этого избежать.

Что происходит с тегами script и style?

Содержимое script, style и pre обрабатывается как сырой текст и не переиндентируется — у этих элементов свои правила форматирования. Только открывающий и закрывающий теги меняют позицию.

// похожие инструменты

// о инструменте

// когда использовать

// faq