구조관련 요소중 하나인 section과 그에 관련된 태그들을 살펴보겠습니다.
1. section 태그란?
section 태그는 HTML 문서에서 섹션(section) 부분을 정의합니다.
또한 <section> 태그는 HTML5에서 새롭게 추가된 요소입니다.
섹션(section)이란 제목을 가지고 있으며, HTML 문서의 전체적인 내용과 관련이 있는 콘텐츠들의 집합을 의미합니다.
HTML 문서에서 맥락이 같은 요소들을 주제별로 그룹화해주는 태그이며 <section>주제에 대한 제목 요소
(<h2>~<h6>) 를 포함하는것이 좋습니다. 텍스트,인라인 요소, 블록 요소를 포함할 수 있습니다.
주로 연관된 문서의 독립적 단락을 정의할 때 사용합니다.
<main>태그 안에 <section>태그를 사용할 수 있지만, 반대로 <section>태그 안에 <main>태그를 사용할 순 없습니다.
이제 <section>과 연관된 태그들을 살펴보겠습니다.
2. section과 관련된 article 태그
article 태그는 <section>과 마찬가지로 특정한 영역을 그룹화할 때 사용합니다.하지만 section 태그와는 다르게 해당 페이지에서 다른 페이지나 다른 영역에 언제든지 독립적으로 갖다 붙힐 수 있는 영역을 그룹화합니다.HTML 문서 내에서 독립적으로 배포 또는재사용이 가능한 게시물, 뉴스 기사, 블로그 포스팅 등에 사용하기 좋은태그이며 제목 요소 (<h2>~<h6>) 를 포함하는것이 좋습니다. 또한 텍스트, 인라인 요소, 블록 요소를 포함할 수 있습니다.
즉 정리 하자면,section 태그는 영역을 감싸거나 구분할때.article 태그는 영역을 나누지만 언제든 그 영역이 다른 페이지나 영역에 가져가 쓸 수 있는 것입니다.
3. 그외 관련된 태그들
1. <header>태그
HTML5에 새로 추가된 요소로서, 웹 문서 맨 윗부분에 있으며 웹 사이트 이름, 글로벌 링크(로그인,회원가입, 사이트맵 등등) 등으로 구성된 영역입니다.
텍스트, 인라인 요소, 블록 요소를 포함할 수 있지만 <header>, <footer> 태그는 포함할 수 없습니다.
2. <nav>태그
HTML5에 새로 추가된 요소로서, 목적지로 이동할 수 있도록 링크를 별도로 모아두거나 HTML문서의 메인메뉴나 목차 등을 정의해주는 태그입니다.
3. <main>태그
문서 내에 <main>태그는 1번만 사용이 가능합니다.
<main>태그를 <article>, <aside>, <footer>, <header>, <nav> 태그의 하위로 사용하지 않습니다.
4. <aside>태그
페이지 전체 내용과는 어느 정도 관련이 있지만 주요 내용과는 연관성이 없는 분리된 내용을 담습니다.
주로 HTML문서내에 오른쪽이나 왼쪽의 사이드 메뉴나 광고 등의 영역으로 사용합니다.
5. <footer>태그
웹 문서 맨 아래쪽에 있으며 저작권, 연락처 등으로 구성된 영역입니다.
주로 본문과 연관은 있지만 본문에는 담기 어려운 내용을 담습니다.
HTML에 구조 관련 태그들의 정보를 찾아봤습니다.
레이아웃 만들때 많이 사용해봐서 태그 명들이 익숙합니다!이대로 공부 화이팅~~!