1. <header>태그 - 머리말 지정
사이트 전체의 헤더는 주로 페이지 맨 위쪽이나 왼쪽에 삽입하며 헤더의 내용으로는 주로 <form> 태그를 사용해 검색창을 넣거나 <nav> 태그를 사용해 사이트 메뉴를 넣습니다.
2. <nav> 태그 - 문서를 연결하는 내비게이션 링크
동일한 사이트 안의 문서나 다른 사이트의 문서로 연결하는 링크 모음을 나타냅니다. 푸터에 있는 사이트 링크 모음 부분에도 많이 사용됩니다.
3. <section> 태그 - 주제별 콘텐츠 영역
문맥 흐름 중에서 콘텐츠를 주제별로 묶을 때 사용하며 그 안에서 섹션 제목을 나타내는 <h1>~<h6> 제목 태그가 함께 사용됩니다.
4. <article> 태그 - 콘텐츠 내용
<section> 태그와 비슷해 혼동하기 쉬운 <article> 태그는 웹 상의 실제 내용을 넣습니다. 태그를 적용한 부분을 떼어 내 독립적으로 배포하거나 재사용하더라도 완전히 하나의 콘텐츠가 된다면 <article> 태그를 쓰면 됩니다.
5. <aside> 태그 - 본문 이외의 내용 표시
본문 내용 외에 주변에 표시되는 기타 내용들을 나타냅니다.
6. <iframe> 태그 - 외부 문서 삽입
일반적으로 웹 문서 안에 내용을 직접 입력하지만 다른 외부 문서를 삽입할 수도 있습니다. 이러한 인라인 프레임을 삽입하는 태그는 <iframe> 태그입니다.
<iframe src="삽입할 문서 주소" [속성 = "속성 값"] </iframe>
<iframe> 태그에서는 여러 속성을 이용해 원하는 형태로 표시할 수 있습니다.
속성 |
설명 |
width |
인라인 프레임의 너비다. 픽셀이나 백분율 값으로 표시한다. |
height |
인라인 프레임의 높이다. 픽셀이나 백분율 값으로 표시한다. |
name |
인라인 프레임의 이름이다. |
src |
프레임에 표시할 문서의 주소를 지정한다. |
seamless |
프레임의 테두리를 없애 마치 본문ㄴ의 일부처럼 보이도록 만들며 속성 값 없이 seamless라고 쓰면 된다. 이 속성은 아직 크롬과 사파리에서만 지원한다. |
7. <footer> 태그 - 제작 정보와 저작권 정보 표시
사이트 제작자의 연락처 정보와 저작권 정보를 표시합니다.
8. <address> 태그 - 사이트 제작자 정보, 연락처 정보 표시
<address> 태그는 주로 <footer> 태그 안에 사용되는데 웹 페이지 제작자의 이름이나 제작자의 웹 페이지 또는 피드백을 위한 연락처 정보를 넣는 데 사용됩니다. 그리고 웹 사이트와 관련된 우편 주소도 <address> 태그 안에 포합시킵니다. 하지만 단순히 우편 주소를 표기할 용도라면 <p> 태그를 사용해 표시합니다.
<출처> HTML5+CSS3 웹 표준의 정석
'IT > HTML' 카테고리의 다른 글
| HTML5와 멀티미디어 (0) | 2017.04.21 |
|---|---|
| [HTML 입문] 기타 폼 요소 (0) | 2017.03.28 |
| [HTML 입문] 여러 데이터를 나열하는 태그 (0) | 2017.03.27 |
| [HTML 입문] <input> 태그 (0) | 2017.03.24 |
| [HTML 입문] 폼을 만드는 기본적인 태그 (0) | 2017.03.23 |