분류: 개발 도구
HTML 포맷터
script나 style 내용은 건드리지 않고 로컬에서 HTML을 들여쓰기 정렬
HTML을 붙여넣으면 중첩된 태그를 다시 들여써서 가독성을 높입니다. <script>, <style>, <textarea>, <pre> 내부의 내용은 그대로 유지되어 삽입된 코드와 서식이 절대 깨지지 않습니다. 모든 처리는 브라우저에서 이루어집니다.
정렬되었습니다.
정렬된 HTML
<main>
<!-- LocalTools example -->
<h1>Offline browser tools</h1>
<p>
Everything runs
<b>on your device</b>
.
</p>
<ul>
<li>No upload</li>
<li>No account</li>
</ul>
</main>이 도구는 가벼운 들여쓰기 도구일 뿐, 검증 도구가 아닙니다. 짝이 맞지 않거나 닫히지 않은 태그는 수정하지 않습니다.
이 페이지의 모든 처리는 브라우저에서 이루어집니다. 업로드는 없습니다.
이 도구로 할 수 있는 일
HTML 포맷터는 중첩된 요소를 다시 들여써서, 개발자 도구 없이도 깊게 중첩된 페이지 구조를 한눈에 파악할 수 있게 해줍니다. 이 도구는 완전한 파서가 아니라 가벼운 들여쓰기 도구입니다. 태그, 주석, doctype은 인식하지만 마크업을 검증하거나 짝이 맞지 않는 태그를 복구하지는 않습니다.
사용 방법
- HTML을 입력란에 붙여넣거나 예시를 불러옵니다.
- 2칸 또는 4칸 들여쓰기를 선택합니다.
- 정렬된 결과를 복사해 프로젝트에 다시 붙여넣습니다.
개인정보
이 도구는 전부 브라우저 안에서 동작합니다. 입력한 내용은 업로드되거나 저장되거나 공유되지 않으며, 탭을 닫으면 사라집니다.
자주 묻는 질문
- 제 HTML이 어딘가로 업로드되나요?
- 아니요. 정렬은 페이지 내에서 실행되는 JavaScript로 처리되므로 마크업이 기기 밖으로 나가지 않습니다.
- <script>나 <style> 태그 안의 내용도 바뀌나요?
- 아니요. 삽입된 JavaScript와 CSS는 작성된 그대로 복사됩니다. 다시 정렬하면 의미가 바뀔 수 있기 때문입니다.
- 깨지거나 짝이 맞지 않는 HTML을 고쳐주나요?
- 아니요. 발견한 태그를 기준으로 다시 들여쓸 뿐, 잘못된 마크업을 검증하거나 복구하지는 않습니다.