목차
html5의 태그 구조란
HTML5에서 태그(tag)는 여는 각 괄호(<)로 시작하고 닫는 각 괄호(>)로 끝나는 마크업 구조이다. 괄호 사이의 텍스트는 태그 이름으로, 태그가 나타내는 요소 유형을 정의합니다.
HTML5 태그의 구조는 일반적으로 여는 태그, 내용 및 닫는 태그의 형식을 따릅니다. 예를 들어, 문단 태그(<p>)에는 여는 태그와 닫는 태그(<p>)가 있으며, 그 태그 사이의 모든 것이 문단의 내용으로 간주됩니다.
<p>This is a paragraph.</p>
닫는 태그가 필요 없는 태그도 있는데, 이를 자체 닫는 태그라고 합니다. 닫힘 각 괄호 앞에 슬래시를 추가하여 닫힙니다. 예를 들어 줄 바꿈 태그(<br>)는 자동으로 닫히는 태그이며, 이 태그는 <br/>로 기록됩니다
태그는 웹 페이지의 구조와 레이아웃을 정의하는 데 사용되고 브라우저는 이러한 태그를 사용하여 페이지를 렌더링합니다.
따라서 HTML 문서의 전체 구조는 서로 내부에 중첩된 일련의 태그로 DOM(Document Object Model)이라는 트리 구조를 만듭니다.
html5의 태그 예시
<!DOCTYPE html>
<html>
<head>
<title>My Web Page</title>
</head>
<body>
<h1>Welcome to my website</h1>
<p>This is my personal website where I share my thoughts and ideas.</p>
<ul>
<li>Interest 1</li>
<li>Interest 2</li>
<li>Interest 3</li>
</ul>
<img src="image.jpg" alt="My picture">
<p>Thanks for visiting my website!</p>
</body>
</html>
이 예에서 <!DOCTYPE> 선언은 이것이 HTML5 문서임을 브라우저에 알립니다. <html> 요소는 문서의 루트 요소이며 다른 모든 요소를 포함합니다.
<head> 요소는 브라우저의 제목 표시줄이나 탭에 표시되는 제목과 같은 문서에 대한 메타 정보를 포함합니다.
<body> 요소에는 제목, 단락, 이미지 및 목록과 같은 웹 페이지의 표시 콘텐츠가 포함됩니다.
이 예에서 <h1> 요소는 제목을 포함하고, <p> 요소는 단락을 포함하고, <ul> 요소는 정렬되지 않은 목록을 포함하고, <li> 요소는 목록 항목을 포함하고, <img> 요소는 영상.
이것은 HTML5 문서의 매우 간단한 예이지만 HTML 문서의 기본 구조와 일반적인 HTML 요소의 사용을 보여줍니다.
이어보는 글
HTML5의 다른 글