간단한 예제 시멘틱 태그와 HTML폼
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<!-- 머리말부분 -->
<header>
<!-- 제목과 부제목을 묶어주는 역할 -->
<hgroup>
<!-- h1~h5 숫자가 커질수록 크기가 작아진다. -->
<h1>서울 고등학교 홈페이지</h1>
<h4>우리들만의 즐거운 공간</h4>
</hgroup>
<!-- 메인메뉴,서브 메뉴를 정의할 떄 사용 -->
<nav>
<ul>
<!-- href="#" : 더미태그 -->
<li><a href="#">1학년</a></li>
<li><a href="#">2학년</a></li>
<li><a href="#">3학년</a></li>
</ul>
</nav>
</header>
<!-- 내용 -->
<section>
<!-- 내용의 머릿말 부분 -->
<header>
<h3>이달의 인물</h3>
</header>
<article>
교내 영상제에서 <strong>최우수상</strong> 을받은 <mark>이빛나양</mark>을 만나봅니다.
</article>
</section>
<footer>
© 서울 고등학교
</footer>
</body>
</html>
