입력

출력

HTML 뷰어란?

HTML 뷰어를 사용하면 HTML을 붙여넣거나 작성하여 브라우저에서 어떻게 렌더링될지 실시간 미리보기를 즉시 확인할 수 있습니다. 완전한 개발 환경 없이 HTML 스니펫, 이메일 템플릿 또는 HTML을 빠르게 테스트하는 데 유용합니다.

이 도구는 완전히 브라우저에서 실행됩니다. 미리보기는 srcdoc 속성을 사용하는 샌드박스 iframe에서 렌더링됩니다. 소스 탭에는 형식화된 HTML 소스 코드가 표시됩니다.

이 도구 사용 방법

1

HTML 붙여넣기 또는 업로드

왼쪽 편집기에 HTML을 붙여넣거나 업로드를 클릭하여 파일을 로드합니다. 예제를 클릭하여 예시를 시도해 보세요.

2

미리보기 또는 소스 보기

오른쪽 패널에 HTML의 실시간 미리보기가 표시됩니다. 소스 탭으로 전환하면 형식화된 HTML 소스 코드를 볼 수 있습니다.

3

복사 또는 다운로드

<strong>복사</strong> 또는 <strong>다운로드</strong>를 사용하여 형식화된 소스를 저장합니다. HTML 오류를 검증하려면 HTML 유효성 검사기 도구를 사용해 보세요.

HTML 뷰어 예제

HTML 스니펫을 붙여넣으면 즉시 렌더링됩니다. 간단한 예시입니다:

HTML 입력

입력

HTML 뷰어가 유용한 경우

HTML 뷰어는 HTML 스니펫을 빠르게 테스트하거나 이메일 템플릿을 확인하거나 자동 생성된 HTML을 검토하거나 동료와 HTML의 시각적 미리보기를 공유하고 싶을 때 유용합니다.

HTML 구조 검증 및 오류 감지를 위해 HTML 유효성 검사기 도구를 사용하세요.

자주 묻는 질문

미리보기가 샌드박스 처리되어 있나요?

네. 미리보기는 sandbox="allow-scripts" 속성을 가진 샌드박스 iframe에서 실행됩니다. 이로 인해 쿠키나 상위 페이지에 대한 접근이 방지됩니다.

HTML이 서버로 전송되나요?

아니요. 미리보기는 iframe의 srcdoc 속성을 사용하여 브라우저에서 완전히 렌더링됩니다.

관련 도구

HTML Living StandardMDN iframe 문서를 참조하세요.