Тег article

Тег article предназначен для независимых самодостаточных блоков сайта, которые могут быть использованы в качестве самостоятельной страницы.

Например, если у вас сайт со статьями, то статью можно разместить в этом теге. Если у вас комментарии пользователей, то каждый из этих комментариев можно разместить в этом теге.

При этом, если у вас есть тег main для контента сайта, то article может размещаться внутри main, но не наоборот.

Пример

Оформим текст статьи в тег article:

html<div id="wrapper">
  <header>
    ...
  </header>
  <main>
    <article>
      <h1>Header</h1>
      <p>
        text
      </p>
      <p>
        text
      </p>
    </article>
  </main>
  <footer>
    ...
  </footer>
</div>
 

Пример

Оформим посты в тегах article:

html<div id="wrapper">
  <header>
    ...
  </header>
  <main>
    <h1>New posts</h1>
    <article>
      <h2>Post 1</h2>
      <p>
        text
      </p>
      <p>
        text
      </p>
    </article>
    <article>
      <h2>Post 2</h2>
      <p>
        text
      </p>
      <p>
        text
      </p>
    </article>
  </main>
  <footer>
    ...
  </footer>
</div>
 

Смотрите также