Элемент статьи
HTML |
---|
Сравнения |
Статья HTML5 — это элемент HTML5 семантический , аналогичный <section>
и <header>
. Чаще всего он используется для хранения информации, которая может распространяться независимо от остальной части сайта или приложения, в котором она появляется.
Особенности и использование
[ редактировать ]HTML5 <article>
Элемент представляет собой полную композицию веб-страницы или веб-приложения , которую можно распространять независимо или повторно использовать, например, при синдикации. Это может быть сообщение на форуме, статья в журнале или газете, запись в блоге, комментарий пользователя, интерактивный виджет или гаджет или любой другой независимый элемент контента. [1]
Примеры
[ редактировать ]По сути, <article>
может использоваться для инкапсуляции основного текста и соответствующего заголовка следующим образом:
<article>
<h2>Insert Title Here</h2>
<p>Insert a paragraph of text here</p>
</article>
Записи и комментарии на форуме обычно создаются путем вложения. <article>
теги:
<article>
<header>
<h1>Entry Title</h1>
<p>Header Info</p>
</header>
<p>Content of entry...</p>
<article>
<header>
<h2>Author: John Smith</h2>
<p>Comment Info</p>
</header>
<p>Comment text...</p>
</article>
<article>
<header>
<h2>Author: Jane Johnson</h2>
<p>2nd Comment's Info</p>
</header>
<p>Comment text...</p>
</article>
</article>
Атрибуты
[ редактировать ]The <article>
Элемент включает только глобальные атрибуты HTML , такие как contenteditable , id и title. [2] Однако pubdate — необязательный логический атрибут <time>
элемент, часто используется в сочетании с <article>
. Если он присутствует, это указывает на то, что <time>
элемент — это дата, <article>
был опубликован. Обратите внимание, что pubdate применяется только к родительскому элементу. <article>
элементу или документу в целом. [3]
Сравнение с <разделом>
[ редактировать ]HTML5 представил оба <article>
и <section>
; оба являются семантическими тегами, определяющими разделы документа, такие как главы, верхние и нижние колонтитулы. [4] [ ненадежный источник? ] <article>
элемент фактически является специализированным видом <section>
и оно имеет более конкретное значение, относящееся к независимому, автономному блоку связанного контента. [3] [5]
Примеры вложения
[ редактировать ]Чтобы лучше организовать независимый контент <section>
теги могут быть вложены внутри <article>
теги:
<article>
<h2>Names of Shapes</h2>
<p>There are several different types of shapes...</p>
<section>
<h4>Triangles</h4>
<p>Here is some info about triangles</p>
</section>
<section>
<h4>Circles</h4>
<p>These Pi-shaped wonders are mesmerizing and...</p>
</section>
</article>
И наоборот, иногда может оказаться целесообразным вложить <article>
элемент внутри <section>
элемент. Например, на веб-странице, содержащей несколько статей на разные темы:
<section>
<h1>Articles about Paris Tourism</h1>
<article>
<h3>The Eiffel Tower</h3>
<p>Standing at over 12 inches high...</p>
</article>
<article>
<h3>The Louvre</h3>
<p>A must-see in Paris tourism...</p>
</article>
</section>
Поддержка браузера
[ редактировать ]Следующие браузеры поддерживают этот элемент: [6]
- Рабочий стол
- Гугл Хром 5.0 и выше
- Firefox 4.0 и выше
- Интернет Эксплорер 9.0 и выше
- Сафари 4.1 и выше
- Опера 11.1 и выше
- мобильный
- Андроид 2.2 и выше
- Firefox Mobile (Gecko) 4.0 и выше
- IE Mobile 9.0 и выше
- Safari Mobile 5.0 и выше
- Opera Mobile 11.0 и выше
Ссылки
[ редактировать ]- ^ «Элемент статьи HTML5 — W3C» . W3.org . Проверено 8 мая 2014 г.
- ^ «Элемент «Содержимое статьи»» . Веб-документы MDN . Проверено 9 июля 2018 г.
- ^ Jump up to: а б «Элемент статьи» . html5doctor.com . Проверено 9 июля 2018 г.
- ^ «Тег раздела» . W3Школы . 30 апреля 2014 г. Проверено 8 мая 2014 г.
- ^ «HTML5: раздел или статья?» . Iandevlin.com . 19 августа 2013 г. Проверено 8 мая 2014 г.
- ^ «Могу ли я использовать... Таблицы поддержки HTML5, CSS3 и т. д.» . caniuse.com . Проверено 9 июля 2018 г.