HTML 형식

HTML 포맷터는 깔끔하고 일관된 들여쓰기로 HTML 마크업을 다시 작성하므로 문서의 구조를 쉽게 읽을 수 있습니다. 축소된 페이지,빌드 도구에서 복사한 스니펫 또는 일치하지 않는 탭과 공백이 있는 손으로 쓴 마크업을 붙여넣고 포맷터는 태그 트리를 구문 분석하여 중첩 깊이당 한 단계의 들여쓰기로 다시 인쇄합니다. 축소하는 역작업은 태그 사이의 중요하지 않은 공백을 제거하여 브라우저가 렌더링하는 방법을 변경하지 않고 프로덕션용으로 파일을 축소합니다.

원시 HTML 은 스캔할 수 있는 상태로 거의 도착하지 않습니다. 서버 템플릿은 한 줄로 내보내고,번들러는 이를 축소하고,붙여넣은 조각은 소스가 사용한 간격이 무엇이든 전달합니다. 아름답게 하면 중첩이 노출되어 필요한 요소를 찾거나,한 번도 닫히지 않은 태그를 발견하거나,두 버전을 깔끔하게 차이낼 수 있습니다. 레이아웃 디버깅,접근성에 대한 마크업 감사 또는 처음으로 다른 사람의 콘텐츠를 읽을 때 가장 중요합니다. 포맷터는 앵글 브래킷 벽을 따라갈 수 있는 윤곽선으로 바꿉니다.

작업된 예제는 이 무료 HTML 포맷터가 엉성한 입력으로 무엇을 하는지 보여줍니다. <ul>PH1__One<li>Two</ul><p>Hi <b>there</b> 붙여넣기,Beautify 와 2 개의 공백을 선택한 상태로 유지하고 포맷을 클릭합니다. 온라인 HTML 포맷터는 목록 항목과 단락을 모두 닫고 각 li 를 자체 들여쓰기 줄에 놓고 <p>Hi <b>there</b><li>0__를 짧은 인라인 콘텐츠이기 때문에 한 줄에 유지합니다. 출력은 5 개의 태그,5 줄,63 바이트,2 개의 경고 목록으로 자동 닫힌 것을 읽으므로 HTML 코드 포맷터는 절대로 깨진 마크업을 자동으로 복구하지 않습니다.

이 도구는 종속성이 없는 파서가 있는 브라우저에서 100% 실행되므로 붙여넣는 항목이 업로드되거나 기록되지 않으며 페이지가 로드된 후에도 오프라인으로 계속 작동합니다. 파서는 의도적으로 허용 오차: 브라우저가 li,p, td 및 옵션과 같은 태그에 사용하는 것과 동일한 암시적 닫힘 규칙을 적용하므로 종료 태그가 생략된 실제 마크업은 여전히 올바른 형식으로 지정됩니다. 스크립트,스타일, pre,textarea 및 제목 내부의 콘텐츠는 그대로 복사됩니다. 즉,JavaScript, CSS 및 사전 형식화된 텍스트는 다시 들여쓰기되거나 깨지지 않습니다.