HTML Formatter & Minifier
Paste markup to lay it out with tidy indents, or minify it by removing comments and spare whitespace. Preformatted text, scripts and styles are respected.
Este conteúdo está em inglês.
Exemplos resolvidos
Laying out nested markup
<div><p>Hello <b>there</b></p><br></div>
<div> <p>Hello <b>there</b></p> <br> </div>
Block elements get their own lines and indents, while the bold text flows inside its paragraph, and br is never given a closing tag.
Minifying a list
<ul> <li>One</li> </ul>
<ul><li>One</li></ul>
Minifying removes the spacing between tags, which makes the page smaller to send.
Sobre HTML Formatter & Minifier
An HTML formatter turns a block of markup into something you can read. Container tags such as div, ul and table are given their own lines and indented to show what sits inside what, while text and inline tags such as b, a and span flow together on a line so the content reads naturally. Long paragraphs are wrapped at a width you choose, and tags with many attributes are split across lines when they would be too long. It copes with both full pages and small snippets.
The same tool also minifies. It removes comments and collapses spare whitespace while keeping the single spaces that separate words, so the page looks the same. Content inside pre and textarea is left exactly as written, script and style blocks keep working, and empty tags such as br, img and input are never given a closing tag. Optionally the inline CSS and JavaScript can be minified too. Problems such as unclosed tags are reported. Everything can be copied or saved with one click.
Como usar HTML Formatter & Minifier
- Paste your HTML into the input box, or open an .html file.
- Choose Beautify to add indents, or Minify to compress.
- Set the indent size and wrap width, or the comment and inline code options.
- Copy the result or download it as a file.
Usos comuns
- Reading markup copied from a live page
- Tidying generated HTML before committing it
- Shrinking a static page or an email template
- Spotting a missing closing tag
Perguntas frequentes
How do I format HTML?
Paste your markup and keep the option on Beautify. Block tags go on their own lines with indents that show nesting, and text with inline tags is kept together and wrapped at the width you pick. Copy the result or download it as page.html when it looks right.
Does minifying HTML change how the page looks?
It should not. Comments are removed and runs of whitespace become a single space, which is how a page treats them anyway. Spaces between words and inline tags are kept, and content inside pre and textarea is left exactly as written.
How are pre, script and style handled?
Text inside pre and textarea keeps every space and line break. Script and style blocks are indented as a whole, but their contents are not rewritten when beautifying. When minifying, you can choose to compress the inline CSS and JavaScript as well.
What are void elements?
Void elements are tags that never have content, such as br, hr, img, input, meta and link. They have no closing tag, so the formatter writes them on a single line and does not add a closing tag after them. A self-closing slash that you typed is kept.
Will it tell me if my HTML has errors?
It reports tags that are never closed and closing tags with no opening partner, which are the most common slips. It is a formatter rather than a full validator, so it does not check attribute names or whether one element is allowed inside another.