반응형
<div> : HTML에서 어떤 구역을 지정할 때 쓰는 태그
<div id=[VALUE]> : div에 아이디를 지정
<a href="#content"> : 웹 접근성 측면에서 tab을 눌렀을 때 본문 바로가기가 나올 수 있게 하는 태그
| HTML 템플릿
HTML 템플릿은 보통 div태그를 통해서 지정하게 된다. 아래는 div에 id를 부여해서 각 구역을 나누는 HTML템플릿의 한 예다.
header, container, footer로 구성하고 이 전체 div요소를 wrap으로 감싼다. container 안에는 또한 content를 포함한 여러 요소로 나눌 수 있다.
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<title>template</title>
</head>
<body>
<p><a href="#content">본문바로가기</a></p>
<div id="wrap">
<!-- header -->
<div id="header">
</div>
<!-- //header -->
<!-- container -->
<div id="container">
<!-- content -->
<div id="content">
</div>
<!-- //content-->
</div>
<!-- //container-->
<!-- footer-->
<div id="footer">
</div>
<!-- //footer-->
</div>
</body>
</html>
출처 : https://www.inflearn.com/course-status-2/
반응형
'Language & Solution > HTML&CSS' 카테고리의 다른 글
| [HTML&CSS] 단어의 정의, 약어, 작품의 제목 표현 // <dfn>, <abbr>, <cite> (0) | 2018.12.10 |
|---|---|
| [HTML&CSS] 구문 강조, 하이라이팅(Highlight) 지정 <string>, <em>, <mark> (0) | 2018.12.10 |
| [HTML&CSS] html meta요소 알아보기 (0) | 2018.11.25 |
| [HTML&CSS] 문서형 선언, 언어 지정, 문자 코드 셋 지정하기 (0) | 2018.11.25 |
| [HTML&CSS] DOCTYPE, p 태그<p>, input 태그 <input>, table 태그 요소 <table>, <tr>, <td> (0) | 2018.11.25 |
