<article>
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since июль 2015 г..
HTML-элемент <article> представляет самостоятельную часть документа, страницы, приложения или сайта, предназначенную для независимого распространения или повторного использования. Этот элемент может представлять статью на форуме, статью в журнале или газете, запись в блоге или какой-либо другой самостоятельный фрагмент содержимого.
Интерактивный пример
<article class="forecast"> <h1>Weather forecast for Seattle</h1> <article class="day-forecast"> <h2>03 March 2018</h2> <p>Rain.</p> </article> <article class="day-forecast"> <h2>04 March 2018</h2> <p>Periods of rain.</p> </article> <article class="day-forecast"> <h2>05 March 2018</h2> <p>Heavy rain.</p> </article> </article> .forecast { margin: 0; padding: 0.3rem; background-color: #eee; } .forecast > h1, .day-forecast { margin: 0.5rem; padding: 0.3rem; font-size: 1.2rem; } .day-forecast { background: right/contain content-box border-box no-repeat url("/shared-assets/images/examples/rain.svg") white; } .day-forecast > h2, .day-forecast > p { margin: 0.2rem; font-size: 1rem; } Данный документ может иметь множество статей; например, когда читатель просматривает блог, в котором текст каждой статьи отображается один за другим, каждая публикация будет находиться в элементе <article>, возможно, с одним или более элементами <section> внутри.
| Категории контента | Основной поток, секционный контент, явный контент. |
|---|---|
| Допустимое содержимое | Основной поток. |
| Пропуск тегов | Нет, открывающий и закрывающий теги обязательны. |
| Допустимые родители | Любой элемент, который разрешает контент основного потока в качестве содержимого. Обратите внимание, что элемент <article> не должен быть потомком элемента <address>. |
| Допустимые ARIA-роли | application, document, feed, main, presentation, region |
| DOM-интерфейс | HTMLElement |
Атрибуты
К этому элементу применимы только глобальные атрибуты.
Примечание
- Каждый элемент
<article>должен быть идентифицирован, обычно путём добавления заголовка (элементы<h1>-<h6>) в качестве дочернего элемента. - Когда элемент
<article>является вложенным, внутренний элемент представляет собой контент связанный с внешним элементом. Например, комментарии к публикации в блоге могут быть элементами<article>, вложенными в другой<article>, являющийся публикацией в блоге. - Информация об авторе в элементе
<article>может быть представлена через элемент<address>, но это не применимо к вложенным элементам<article>. - Дата и время публикации в элементе
<article>могут быть описаны с помощью атрибутаdatetimeэлемента<time>. Обратите внимание, что атрибутpubdateэлемента<time>больше не является частью стандарта W3C HTML5.
Примеры
<article class="film_review"> <header> <h2>Парк Юрского периода</h2> </header> <section class="main_review"> <p>Динозавры были величественны!</p> </section> <section class="user_reviews"> <article class="user_review"> <p>Слишком страшно для меня.</p> <footer> <p> Опубликовано <time datetime="2015-05-16 19:00">16 мая</time> Лизой. </p> </footer> </article> <article class="user_review"> <p>Я согласен, динозавры мои любимцы.</p> <footer> <p> Опубликовано <time datetime="2015-05-17 19:00">17 мая</time> Томом. </p> </footer> </article> </section> <footer> <p> Опубликовано <time datetime="2015-05-15 19:00">15 мая</time> Стаффом. </p> </footer> </article> Спецификации
| Specification |
|---|
| HTML # the-article-element |