🌐WEB
[HTML5] 공간태그 - nav태그 / section태그 / article태그의 사용법
Cocoon_
2020. 12. 12. 23:31
반응형
<nav>태그
nav태그는 내비게이션 역할을 하는 링크들의 영역에 사용합니다.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Cocoon</title>
</head>
<body>
<header>
<div id="logo">
코딩 공부 일지
</div>
<nav>
<ul>
<li>알고리즘 문제풀이</li>
<li>WEB</li>
<li>JAVA</li>
<li>일상</li>
</ul>
</nav>
</header>
</body>
</html>
<section>태그
section태그는 서브 제목과 관련된 내용을 표시할 때 사용합니다.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Cocoon</title>
</head>
<body>
<h1>웹 언어의 종류</h1>
<section>
<h2>HTML</h2>
<p>태그로 이루어진 웹페이지의 토대가 되는 언어</p>
</section>
<section>
<h2>CSS</h2>
<p>웹페이지의 태그에 붙여진 선택지를 이용하여 스타일을 적용하는 언어</p>
</section>
</body>
</html>
<article>태그
article태그는 블로그에 글을 작성하거나 기사를 작성할 때 사용합니다.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Cocoon</title>
</head>
<body>
<article>
<h1>아스트라 등 코로나 백신 4400만명분 확보... 내년2~3월부터 도입</h1>
<p>정부 ’코로나19 백신 도입 계획’ 발표 아스트라 제네카·화이자·얀센·모더나 등 4개사와 선구매 계약 체결 혹은 추진중
</p>
</article>
</body>
</html>
📚 참고
참고 서적 - 웹코딩 시작하기 (저자 김태영)
반응형