HTML <main> 요소를 사용하는 방법

HTML <main> 사용 방법 알아보기 요소.

HTML <main> 요소는 <body 내에서 페이지 콘텐츠의 주요/주요 부분을 나타내는 컨테이너로 사용됩니다. 요소.

예:

<body>
  <header><!-- Header content --></header>
  <main>
    <article>
      <h3>Google Chrome</h3>
      <p>Paragraph</p>
    </article>

    <article>
      <h3>Headline</h3>
      <p>Paragraph</p>
    </article>

    <article>
      <h3>Headline</h3>
      <p>Paragraph</p>
    </article>
  </main>
  <footer><!-- Footer content --></footer>
</body>

<main> 요소에는 문서 주제의 중심이 되는 콘텐츠가 포함되어 있습니다.

<header> 동안 및 <footer> 요소에는 콘텐츠(일반적으로 링크 및 로고)도 포함되지만 웹사이트의 주요 부분으로 간주될 수 없으므로 <main> 외부에 배치해야 합니다. 요소.

<article>과 달리 콘텐츠 컨테이너이기도 한 요소인 <main> 요소는 동일한 HTML 문서 내에서 한 번만 사용해야 합니다.

예를 들어

<main>
  <article>
    <h1>Title of your post</h1>
    <p>Paragraph</p>
    <p>Paragraph</p>
    <img href="your-image.jpg" alt="description of image" />
    <p>Paragraph</p>
    <p>Paragraph</p>
  </article>
</main>

오른쪽에서 읽고 있는 웹사이트는 유사한 HTML 마크업 구조를 따릅니다. 이 웹사이트를 마우스 오른쪽 버튼으로 클릭하고 검사를 클릭하면 직접 확인할 수 있습니다.

<main> 태그는 컨테이너 요소를 정의하는 데 사용되는 많은 HTML 태그 중 하나입니다. 가장 일반적으로 사용되는 HTML 컨테이너 요소는 다음과 같습니다.

<section> , <article> , <header> , <footer> ,<form> 및 <div> (다른 태그가 적용되지 않는 경우 사용하는 일반 태그입니다.)

HTML 요소를 사용하는 방법

HTML
요소를 사용하는 방법