<!DOCTYPE html>
<html lang="ko">
<head>
<title>HTML5 기본 구조 요소</title>
</head>
<body>
<header>
<h1>HTML5</h1>
</header>
<section>
<article>
<h2>문서 내용2</h2>
<h3>문서 내용2</h3>
<h4>문서 내용3</h4>
<h5>문서 내용4</h5>
<h6>문서 내용5</h6>
</article>
</section>
<footer>
<!--사이트 정보 표시-->
</footer>
</body>
</html>
HTML5의 기본적인 문서 구조이다.
<!DOCTYPE html>
HTML5 문서임을 선언하는 구문이다
현재 문서가 HTML5로 작성된 웹 문서임을 나타낸다.
<html>
<!DOCTYPE html>
<html lang="ko">
<!--문서 내용-->
</html>
HTML5 문서의 시작과 끝을 알리는 태그
언어"lang" 속성을 사용하여 언어 값을 설정할 수 있다 영어로 작성된 문서일 시 "lang" 값은 "en"이다.
<head>
<head>
<!--웹 페이지 정보-->
</head>
웹 페이지의 정보를 정의하는 태그
<title> 태그와 자바스크립트, CSS 등이 들을 정의한다.
<title>
<head>
<title>HTML5 문서의 제목</title>
</head>
HTML5 문서의 제목을 나타내는 태그
<body>
<body>
<!--본문 영역1-->
<!--본문 영역2-->
<!--본문 영역3-->
</body>
HTML5 문서의 본문을 작성하는 태그
우리가 웹 페이지에서 처음으로 보는 것이 이 <body> 태그에 작성된 것이다.
<header>
<body>
<header>
<!-- 사이트 제목, 로고 등 -->
</header>
</body>
HTML5 문서의 머리말 영역으로 소개 및 탐색에 도움을 주는 중요한 정보를 표시한다.
<section>
<body>
<section>
<header>
<h2>부제목1</h2>
</header>
<p>이곳은 세션 영역입니다.</p>
</section>
</body>
문서의 영역을 구성할 때 사용된다. <header>, <article> 태그 등을 포함할 수 있다.
<article>
<body>
<section>
<article>
<h3>문서 내용1</h3>
<h3>문서 내용2</h3>
</article>
</section>
</body>
독립된 주요 콘텐츠 <article>를 정의할 때 사용된다.
하나의 <section> 태그 내에 여러개의 <article> 태그를 구성할 수 있다.
<footer>
<body>
<footer>
<!--사이트 정보 표시-->
</footer>
</body>
HTML5 문서의 꼬리말 영역이다.
사이트의 자세한 정보를 표시한다. ex) 저작권 정보, 관리자 정보, 회사 정보 등
<h1,h2....>
<body>
<h1>h1</h1>
<h2>h2</h2>
<h3>h3</h3>
<h4>h4</h4>
<h5>h5</h5>
<h6>h6</h6>
</body>
해당영역의 제목을 뜻하는
태그이며 숫자가 작아질 수록 글자 크기가 커진다
<hr>요소
| 속성 | 값 | 설명 |
| align | left, center, right | 수평선의 정렬의 지정한다. |
| noshade | noshade | 수평선의 입체감을 제거한다. |
| size | pixels | 수평선의 두께를 지정한다. |
| width | pixels, % | 수평선의 상대적 넓이를 지정한다. |
.
구분선을 그을 때 사용된다.
'Front_end > HTML' 카테고리의 다른 글
| HTML - 목록 요소 (0) | 2024.08.12 |
|---|---|
| HTML - <a> (0) | 2024.07.29 |
