💻
개발자 도구
개발자 도구
HTML 정리 기능
HTML Formatter · HTML Beautifier — 정렬되지 않은 HTML 코드를 2칸 들여쓰기 기준으로 자동으로 정리합니다. js-beautify 라이브러리를 사용해 태그 계층 구조를 명확하게 시각화합니다. 정리된 결과를 즉시 복사할 수 있습니다. 무료 온라인 HTML 코드 정리 도구.
사용 방법
① 정리할 HTML 코드를 입력창에 붙여넣습니다. ② '정리하기' 버튼을 클릭합니다. ③ 들여쓰기가 맞춰진 정리된 HTML이 하단에 표시됩니다. ④ 복사 버튼으로 결과를 클립보드에 저장합니다.
이런 때 사용하세요
• 압축(minify)된 HTML을 읽기 쉽게 변환할 때 • 복사해온 코드의 들여쓰기를 일관되게 정리할 때 • 코드 리뷰 전 HTML 구조를 명확히 파악할 때 • 이메일 템플릿·CMS 코드를 정리할 때
자주 묻는 질문
- Q. 어떤 형식의 HTML도 정리할 수 있나요?
- A. HTML5 문서와 태그 조각 모두 처리 가능합니다. 잘못된 마크업은 최대한 보정해 출력합니다.
- Q. 원본 코드 내용이 변경되나요?
- A. 들여쓰기와 줄바꿈만 조정하며 태그·속성·텍스트 내용은 변경되지 않습니다.
- Q. 들여쓰기 크기를 바꿀 수 있나요?
- A. 현재는 2칸 들여쓰기로 고정되어 있습니다. 추후 옵션 추가가 예정되어 있습니다.
- Q. Inline CSS·JavaScript가 포함된 HTML도 정리되나요?
- A. 네. `<style>` 태그 안의 CSS와 `<script>` 태그 안의 JavaScript도 함께 정리됩니다.
- Q. HTML Formatter(정리)와 HTML Validator(검증)는 어떻게 다른가요?
- A. Formatter는 코드 가독성을 위해 들여쓰기·줄바꿈을 정리하는 것이고, Validator는 HTML 문법 오류를 찾아내는 것입니다. 이 도구는 Formatter 기능을 제공합니다.