본문 바로가기
WEBIS 웹유틸무료 온라인 도구

개발 도구 · 브라우저 실행

HTML 포매터

HTML 태그 중첩과 Void 태그를 확인하면서 읽기 쉬운 들여쓰기 결과로 정리합니다.
  • 브라우저 안에서 즉시 처리
  • 입력값은 도구 DB에 저장하지 않음
  • 계산 입력을 외부로 전송하지 않음

HTML 구조 정리

태그 중첩을 확인하고 들여씁니다

브라우저 처리

원문과 결과는 현재 브라우저에서만 처리하며 WEBIS 서버 DB에 저장하거나 외부 서비스로 전송하지 않습니다.

정리된 HTML

읽기 전용
결과 줄
태그 수
결과 바이트

템플릿 문법이나 script/style 내부 코드는 완전한 HTML 파서와 다르게 정렬될 수 있습니다.

샘플을 불러와 처리 결과를 준비합니다.

빠른 사용법

세 단계로 확인합니다.

  1. 1
    HTML 조각을 입력합니다

    컴포넌트·메일·게시물 등 구조를 확인할 HTML 원문을 붙여넣습니다.

  2. 2
    태그 중첩 경고를 확인합니다

    여닫는 태그 순서와 닫히지 않은 일반 태그를 확인하고 Void 태그는 별도로 처리합니다.

  3. 3
    들여쓴 결과를 검토합니다

    2칸 또는 4칸 간격 결과와 줄·태그·바이트 수를 확인해 복사합니다.

결과 읽기

HTML 파서의 자동 복구와 소스 검사는 다릅니다.

브라우저는 잘못된 마크업을 자동 보정할 수 있지만 이 도구는 원문 태그 스택을 기준으로 의심되는 중첩을 드러냅니다.
VOIDVoid 태그 인식

img, br, meta, input 등 닫는 태그가 없는 표준 요소는 깊이를 늘리지 않습니다.

STACK중첩 순서

최근에 연 태그부터 닫혀야 한다는 스택 원칙으로 명백한 순서 오류를 표시합니다.

TEXT본문 공백 정리

태그 사이 텍스트의 연속 공백을 한 칸으로 보여 주므로 공백 민감 콘텐츠는 원본을 보관해야 합니다.

script·style·템플릿 문법을 완전하게 파싱하지 않는 경량 정리 도구입니다. 출력 HTML을 실행하거나 미리보기로 삽입하지 않습니다.

이럴 때 유용합니다.

  • 컴포넌트 HTML 중첩 검토
  • 압축 마크업의 구조 파악
  • Void 태그와 닫힘 태그 빠른 확인

함께 확인하세요.

  • 템플릿·JSX·Vue 지시문은 일반 HTML과 다를 수 있음
  • pre·textarea처럼 공백이 중요한 본문은 결과 재확인
  • 정리 결과를 신뢰되지 않은 페이지에 그대로 삽입하지 않음

자주 묻는 질문

사용 전 알아둘 점

HTML을 실제 화면으로 렌더링하나요?

아닙니다. 안전을 위해 원문과 결과를 텍스트로만 표시하며 DOM에 실행 가능한 HTML로 삽입하지 않습니다.

img나 br에 닫는 태그가 없어도 오류가 아닌가요?

네. 표준 Void 태그 목록은 닫는 태그 없이 정상으로 처리합니다.

원문이 서버로 전송되나요?

아닙니다. 포맷과 경량 검사는 현재 브라우저에서만 실행합니다.