HTML5에서 새로 생긴 Sematic 요소들입니다.

HTML5에서 새로 생긴 Sematic 요소들입니다.

독립적으로 배포 또는 재사용되도록 의도 된 문서, 페이지, 애플리케이션, 또는 사이트에 독립적인 조성물을 나타냅니다. 예로는 포럼 게시물, 잡지 또는 신문 기사 또는 블로그 항목이 있습니다.

<aside>

요소는 콘텐츠 간접적 문서의 메인 콘텐츠와 관련된 문서의 일부를 나타냅니다.

위젯이 "개방" 상태로 전환되는 경우 정보가 표시되는 공개 위젯을 생성합니다. <summary>요소를 사용하여 요약 또는 레이블을 제공 할 수 있습니다 .

<figure>요소는 자주 캡션(<figcaption>)과 함께, 독립적으로 컨텐츠를 나타내며, 일반적으로 단일 단위로 참조된다.

요소는 부모 <그림> 요소의 나머지 내용에 대한 캡션 또는 범례를 나타낸다.

HTML <footer> 요소는 가장 가까운 단면 내용에 대한 바닥글을 나타낸다. 바닥글에는 일반적으로 섹션 작성자, 저작권 데이터 또는 관련 문서에 대한 링크가 포함되어 있다.

HTML <header> 요소는 일반적으로 도입부의 그룹을 나타낸다. 일부 제목 요소들을 포함할 수 있지만 로고, 검색 양식, 저자 이름 및 다른 요소들도 포함할 수 있다.

<main>

HTML <main> 요소는 <body>의 지배적인 내용을 나타낸다. <main>요소를 사용한 영역에는 문서의 중심 주제 또는 애플리케이션의 중심 기능성과 직접 관련되거나 확장되는 내용으로 구성된다.

<mark>

HTML <mark> 요소는 문맥 가운데 중요성을 강조하기 위한 목적으로 사용됩니다.

<nav>

HTML <nav> 요소는 현재 문서 또는 다른 문서에 대한 탐색 링크를 제공할 목적으로 페이지의 섹션을 나타냅니다. 탐색 섹션의 일반적인 예로는 메뉴, 목차, 색인 등이 있습니다.

HTML <section> 요소는 HTML 문서 내에서 독립되어있는 부분을 나타내며, 구획을 나누기 위해서 사용합니다. 항상 그렇지는 않지만, <section>에는 표제가 있습니다.

<time>

HTML <time> 요소는 특정 기간을 나타낸다. 더 나은 검색 엔진 결과나 미리 알림과 같은 사용자 지정 기능을 허용하여 날짜를 기계 판독 가능한 형식으로 변환하는 Datetime 속성을 포함할 수 있다.

각 요소의 의미가 무엇인지 파악해보며, 예제코드를 확인해보기

💻mc.haemil