FormattersLesson 7Free preview

HTML Formatter

This lesson is part of Web Developer Tools · All levels

Summary

HTML Formatter refines the tag layout with tiered indentation so that parent-child relationships are clear. This tool is useful for long HTML files or copy-paste results from other editors. Void elements such as br and img do not have a closing tag, whereas pre and textarea content should be left as it is. The formatter is just fixing the look, not fixing the invalid HTML structure.

Key points

Make a layered indentation according to the element nest
Void elements like br, img, and input have no closing tag
The content of the pre and textarea is sensitive to the whitespace so it must be kept
Attribute can be refined, but value attribute cannot be changed
The formatter doesn't fix the wrong nesting or missing tag

Full lesson

Code examples and quizzes

Full lessons, code examples, and quizzes are available to subscribers. 5 questions.