웹페이지의 핵심이 되는 콘텐츠는 <main></main> 태그로 감싸줘야 합니다.
하지만 <main> 태그를 사용할 시에는 간단한 법칙을 지켜줘야 합니다.
지금부터 그 내용을 알아보겠습니다.
<main> 태그
의미론적 태그 semantic element
이 포스팅은 PC로 작성되었습니다. 모바일로 보시는 분들에게는 가끔 줄 바꿈이 어색하게 보일 수 있습니다. 지난 포스트 meta 태그 이 포스팅은 PC로 작성되었습니다. 모바일로 보시는 분들에게
gogogameboy.tistory.com
위의 포스트와 연관이 되어있는 내용입니다.
하지만 위의 포스트에는 <main> 태그에 대해서는 나와있지 않습니다.
<main> 태그는 페이지의 핵심이 되는 콘텐츠를 감싸는 태그입니다.
다만 <main> 태그는 한 가지 주의해야 할 점이 있습니다.
<header>, <nav>, <section>, <article>, <footer> 태그 내에서 사용해서는 안된다는 점입니다.
<section>, <article> 태그는 <main> 태그 내에 들어가야 합니다.
<main> 태그가 <section>과 <article> 태그 내에 들어가서는 안됩니다.
실사용 예를 보여드리며 글을 마치겠습니다.
위의 소스 코드는 PC에서 드래그 후,
ctrl+x로 잘라내서 다른 곳으로 붙여넣기가 가능합니다.
ctrl+c(복사)는 불가능합니다.
이 글이 도움이 됐다면 하단의 ♡ 공감 버튼을 꾹 눌러서
빨간 하트♥로 만들어주세요.
지인에게 보여주고 싶은 글이었다면
공감 버튼 옆을 클릭해서 SNS에 공유해주세요.
댓글은 블로그 운영에 큰 힘이 됩니다.
'front-end > html' 카테고리의 다른 글
| HTML, 같은 페이지의 특정 위치로 링크를 거는 태그 (0) | 2021.02.09 |
|---|---|
| HTML에서 사용할 수 없는 특수문자를 표시하는 코드 (0) | 2021.02.07 |
| HTML, 한자의 발음을 써놓을 때 사용하는 태그 (0) | 2021.02.06 |
| HTML, 책이나 다른 사람의 글을 인용할 때 써야할 태그 (0) | 2021.02.05 |
| HTML 위첨자, 아래첨자 태그 (0) | 2021.02.04 |
댓글