HTML 정렬 및 포매터

속성, 텍스트, pre·script·style 내용을 유지하며 HTML 조각을 들여씁니다. 정렬 후 공백도 확인하세요.

브라우저 안에서 처리하며 데이터를 업로드하지 않습니다.

데이터 설정

데이터 설정

100,000자와 10,000토큰 이하입니다. HTML 전용이며 검증과 JSX 변환은 없습니다. 블록 사이 공백은 바뀔 수 있습니다.

결과

값을 입력하면 결과를 확인할 수 있습니다.

입력값과 파일 내용은 포함하지 않고 어떤 도구를 자주 사용하는지 집계합니다. 개인정보

사용 방법

HTML 복사본으로 작업하세요. 속성과 pre, script, style, textarea, title을 보존하고 블록 사이 공백을 조절합니다. JSX를 변환하거나 문서를 검증하지 않습니다.

예제 입력값
입력값결과
<div><p>A <strong>B</strong> C</p></div><div> <p>A <strong>B</strong> C</p> </div>

계산 방법과 제한

블록 요소 사이에 공백을 추가하거나 바꿉니다. CSS white-space를 적용한 결과를 확인하세요. HTML을 검증하거나 실행하지 않습니다.

예시

사용 사례

입력값
<div><p>A <strong>B</strong> C</p></div>
결과
<div> <p>A <strong>B</strong> C</p> </div>

strong 요소를 포함한 문장에서 전후 공백은 단어를 구분하므로 유지하세요. pre 내부의 줄바꿈과 앞 공백도 외부 요소를 들여써도 그대로 보존해야 합니다.

이 도구의 제한은 무엇인가요?

100,000자와 10,000토큰 이하입니다. HTML 전용이며 검증과 JSX 변환은 없습니다. 블록 사이 공백은 바뀔 수 있습니다.

입력값과 결과는 브라우저에서 처리되며 서버로 전송되지 않습니다. 집계 통계가 활성화된 경우 도구 이름과 처리 성공 여부만 기록하며 내용은 기록하지 않습니다.

출처

실용 가이드

HTML 공백과 들여쓰기: 정렬 후 확인할 점

공백이 페이지에 영향을 주는 경우와 HTML 조각을 정렬한 뒤 점검할 항목을 예제로 알아봅니다.

단계별로 따라 하기

즐겨찾기