반응형
HTML 문서의 기본 구조
HTML 문서의 기본 구조는 웹 페이지의 뼈대를 형성하며, 주로 다음과 같은 요소들로 구성됩니다.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>문서 제목</title>
</head>
<body>
<h1>가장 큰 제목</h1>
<p>문단입니다.</p>
<!-- 여기에 더 많은 HTML 요소들이 들어갈 수 있습니다. -->
</body>
</html>
<!DOCTYPE html>
: 이 선언은 문서가 HTML5를 따르고 있음을 브라우저에 알리는 역할을 합니다. 이는 문서의 최상단에 위치해야 합니다.<html>
: 이 태그는 HTML 문서의 루트 요소로, 문서의 전체 내용을 감싸는 컨테이너 역할을 합니다.<head>
: 문서의 메타데이터를 포함하는 부분으로, 예를 들어 문서의 제목(<title>
), 문자 인코딩(<meta charset="UTF-8">
), 스타일시트 링크(<link>
), 스크립트(<script>
), 기타 메타 정보(<meta>
) 등이 이 안에 포함됩니다.<title>
: 브라우저 탭에 표시되는 문서의 제목을 정의합니다.<body>
: 실제로 브라우저에 표시되는 문서의 내용을 담는 부분입니다. 텍스트, 이미지, 링크, 리스트, 테이블 등의 요소들이 여기에 위치합니다.- 주석(
<!-- 주석 내용 -->
): 문서 내에서 코드에 대한 설명이나, 임시로 코드를 비활성화할 때 사용합니다. 브라우저에는 표시되지 않습니다.
위의 구조는 HTML 문서를 작성할 때의 기본적인 템플릿으로, 웹 페이지를 구성하는 기본적인 요소들을 포함하고 있습니다.
기본 문서의 표현
HTML 소스를 'index.html'로 저장하고 크롬에서 불러낸 모습은 아래와 같습니다.
정리
HTML 문서는 `<!DOCTYPE html>`, `<html>`, `<head>`, `<body>` 태그로 구성되며, 제목과 내용을 담습니다.
반응형
'온라인 멘토와 함께하는 공부 > HTML' 카테고리의 다른 글
[HTML] DOM이란? (56) | 2023.12.06 |
---|---|
[Sigil] Sigil에서 'content.opf'와 'toc.nox' (7) | 2023.12.05 |
Visual Studio Code의 인터페이스 한글화 (66) | 2023.11.23 |
HTML 편집기에 대해서 (55) | 2023.11.22 |
[스타일시트] 전자책 편집을 위한 스타일시트 (62) | 2023.10.21 |