HTML 에디터
HTML 소스를 편집하고 sandbox iframe으로 안전하게 미리봅니다.
HTML 소스 · 미리보기
iframe sandbox로 스크립트·폼을 차단한 미리보기입니다.
사용 방법
- HTML 소스에 문서나 조각 마크업을 입력합니다.
- 미리보기를 누르면 아래 미리보기 (sandbox) 프레임에 렌더링됩니다.
- 스크립트와 폼은 샌드박스 제한으로 실행·제출되지 않습니다.
- 레이아웃만 확인하고 소스를 고친 뒤 미리보기를 다시 누릅니다.
- 초기화는 소스를 비우고 빈 문서로 프레임을 갱신합니다. 복사 버튼은 없습니다.
핵심 개념
HTML 에디터는 소스와 미리보기를 한 화면에 둔 스케치 도구입니다. 미리보기는 격리된 프레임에 문서를 넣되 샌드박스를 최대로 걸어 스크립트 실행과 폼 제출, 같은 출처 접근을 막습니다. 배너 시안이나 표 마크업을 빠르게 눈으로 확인할 때 HTML 에디터가 적합합니다. 브라우저 전체 개발자 도구를 대체하지는 않으며, 상호작용이 필요한 앱은 로컬 서버에서 여는 편이 맞습니다. 소스가 비어 있어도 미리보기를 누르면 빈 문서가 프레임에 들어가 이전 그림이 지워집니다.
미리보기를 누르기 전에는 프레임이 비어 있거나 이전 결과가 남을 수 있으므로, 수정 후에는 항상 버튼을 다시 눌러야 합니다. 이 HTML 에디터는 파일을 저장하거나 서버에 소스를 올리지 않습니다. 외부 이미지 주소가 있으면 네트워크로 이미지를 불러올 수는 있지만, 페이지 스크립트는 차단됩니다. 검사기·포맷터와 함께 쓰면 구조 점검과 시각 확인을 나눌 수 있습니다. 복사 버튼이 없으니 소스 칸 텍스트를 직접 선택해 가져가면 됩니다.
예시
소스에 <h1>미리보기</h1><p>안녕하세요</p> 를 넣고 미리보기를 누르면 프레임에 제목과 문단이 그려집니다. 스크립트 태그를 넣어도 샌드박스 때문에 실행되지 않습니다. 내용을 고친 뒤에는 미리보기를 다시 눌러야 프레임이 갱신되고, 초기화를 누르면 빈 문서로 돌아갑니다.
자주 묻는 질문
HTML 에디터 미리보기에서 자바스크립트가 실행되나요?
실행되지 않습니다. 프레임 샌드박스가 스크립트와 폼을 막아 시안 확인용으로만 동작합니다.
HTML 에디터는 타이핑할 때마다 미리보기가 바뀌나요?
아니요. 미리보기 버튼을 눌렀을 때만 프레임 내용이 갱신됩니다. 초기화도 빈 문서로 다시 그립니다.
HTML 에디터에 복사 버튼이 있나요?
없습니다. 소스 칸의 텍스트를 직접 선택해 복사하고, 미리보기는 화면 확인용입니다.
외부 이미지는 HTML 에디터 미리보기에 나타나나요?
주소가 유효하면 이미지가 로드될 수 있습니다. 다만 스크립트 기반 위젯은 차단됩니다.
HTML 에디터 소스는 서버에 저장되나요?
저장되지 않습니다. 소스와 프레임 갱신이 브라우저에서만 이루어지며 초기화하면 칸이 비워집니다.
HTML 에디터 초기화 후 프레임은 어떻게 되나요?
소스가 지워지고 빈 문서가 프레임에 들어가 이전 미리보기가 사라집니다. 관련: HTML 포맷터 · HTML 검사기 · 엑셀 → HTML 표
최종 검토일: 2026년 9월 4일