생각해보기
HTML5에서 새로 생긴 Sematic 요소들입니다.
- <article>
- <aside>
- <figcaption>
- <figure>
- <footer>
- <header>
- <main>
- <mark>
- <nav>
- <section>
- <time>
영상에서 다루지 않은 요소들입니다.(사실 다루지 않은 요소가 훨씬 많죠?)
아래 URL을 참고하여 직접 공부를 해보세요.
각 요소의 의미가 무엇인지 파악해보고, 예제 코드를 보고 따라해 보세요.
참고자료
생각해보기
HTML5에서 새로 생긴 Sematic 요소들입니다.
영상에서 다루지 않은 요소들입니다.(사실 다루지 않은 요소가 훨씬 많죠?)
아래 URL을 참고하여 직접 공부를 해보세요.
각 요소의 의미가 무엇인지 파악해보고, 예제 코드를 보고 따라해 보세요.
참고자료
https://developer.mozilla.org
comment
완료
1.7
2023.01.16
체크 완료
HTML5 에서 새로 생긴 시멘틱 요소들
<article> : 사이트 내 독립적 구분 게시판, 블로그 본문, 매거진, 뉴스 기사 등
<section> : 사이트 내 독립적 구분, 더 적합한 의미를 가진 요소가 없을 때 사용, 보통은 헤딩 태그를 포함함
<aside> : 문서 주요 내용과 간접적으로 연관된 부분 표현
사이드바, 콜아웃 박스 등
<main> : Body 태그의 주요 콘텐츠가 담김
<header> : 제목, 로고, 검색, 작성자 이름 등을 표현
<nav> : 현재 페이지 내, 다른 페이지 이동 링크 표현 메뉴, 목차, 색인 등
<footer> : 작성자, 저작권 정보, 관련 문서 내용 등을 표현
<figure> : 독립적인 콘텐츠 표현 Ex) 이미지, 삽화, 도표, 코드 등
<figcaption> : Figure 콘텐츠에 대한 설명을 나타냄
<mark> : 중요 표시, 하이라이트 부분 처리
<time> : 시간의 특정 지점 또는 구간 표현
24시간 표기법 시간 표현, 검색 결과, 알림 기능 등