Логотип schoolsw3.com
Учебники Справочники Упражнения КАК? Меню
Создать
Редактор Поддержка Форум

×
Учебники
Справочники
Упражнения
Пожертвовать Обновление Реклама Видео Магазин

HTML Справочник

HTML Теги по алфавиту HTML Теги по категориям HTML Поддержка браузера HTML Атрибуты тегов HTML Глобальные атрибуты HTML События атрибутов HTML Название цвета HTML Canvas HTML Аудио/видео HTML Наборы символов HTML Типы документов HTML URL Кодировка HTML Код языка HTML Код страны HTTP Сообщения ошибок HTTP Методы GET/POST HTML Конвертер PX в EM HTML Комбинация клавиш

HTML Теги

Тег <!--Комментарий--> Тег <!DOCTYPE> Тег <a> Тег <abbr> Тег <acronym> Тег <address> Тег <applet> Тег <area> Тег <article> Тег <aside> Тег <audio> Тег <b> Тег <base> Тег <basefont> Тег <bdi> Тег <bdo> Тег <big> Тег <blockquote> Тег <body> Тег <br> Тег <button> Тег <canvas> Тег <caption> Тег <center> Тег <cite> Тег <code> Тег <col> Тег <colgroup> Тег <data> Тег <datalist> Тег <dd> Тег <del> Тег <details> Тег <dfn> Тег <dialog> Тег <dir> Тег <div> Тег <dl> Тег <dt> Тег <em> Тег <embed> Тег <fieldset> Тег <figcaption> Тег <figure> Тег <font> Тег <footer> Тег <form> Тег <frame> Тег <frameset> Тег <h1> - <h6> Тег <head> Тег <header> Тег <hr> Тег <html> Тег <i> Тег <iframe> Тег <img> Тег <input> Тег <ins> Тег <kbd> Тег <label> Тег <legend> Тег <li> Тег <link> Тег <main> Тег <map> Тег <mark> Тег <meta> Тег <meter> Тег <nav> Тег <noframes> Тег <noscript> Тег <object> Тег <ol> Тег <optgroup> Тег <option> Тег <output> Тег <p> Тег <param> Тег <picture> Тег <pre> Тег <progress> Тег <q> Тег <rp> Тег <rt> Тег <ruby> Тег <s> Тег <samp> Тег <script> Тег <section> Тег <select> Тег <small> Тег <source> Тег <span> Тег <strike> Тег <strong> Тег <style> Тег <sub> Тег <summary> Тег <sup> Тег <svg> Тег <table> Тег <tbody> Тег <td> Тег <template> Тег <textarea> Тег <tfoot> Тег <th> Тег <thead> Тег <time> Тег <title> Тег <tr> Тег <track> Тег <tt> Тег <u> Тег <ul> Тег <var> Тег <video> Тег <wbr>


HTML Тег <article>



Пример

Три статьи с независимым, автономным содержанием:

<article>
<h2>Google Chrome</h2>
<p>Google Chrome - это веб-браузер, разработанный компанией Google и выпущенный в 2008 году. Chrome - это самый популярный веб браузер в мире на сегодняшний день!</p>
</article>

<article>
<h2>Mozilla Firefox</h2>
<p>Mozilla Firefox - это веб-браузер с открытым исходным кодом, разработанный компанией Mozilla. Firefox стал вторым по популярности веб браузером с января 2018 года.</p>
</article>

<article>
<h2>Microsoft Edge</h2>
<p>Microsoft Edge - это веб браузер, разработанный компанией Microsoft и выпущенный в 2015 году. Microsoft Edge заменил Internet Explorer.</p>
</article>
Попробуйте сами »


Определение и использование <article>

Тег <article> определяет независимое, автономное содержимое.

Статья должна иметь смысл сама по себе, и ее можно распространять независимо от остальной части сайта.

Потенциальные источники для элемента <article>:

  • Forum post
  • Blog post
  • News story

Примечание: Элемент <article> не отображается как что - то особенное в браузере. Однако вы можете использовать CSS для стилизации элемент <article> (смотрите пример ниже).


Поддержка браузеров <article>

Цифры в таблице указывают первую версию браузера, которая полностью поддерживает этот элемент.

Элемент
<article> 6.0 9.0 4.0 5.0 11.1

Глобальные атрибуты <article>

Тег <article> также поддерживает Глобальные атрибуты в HTML.


События атрибутов <article>

Тег <article> также поддерживает События атрибутов в HTML.


Еще примеры <article>

Пример

Используйте CSS для стилизации элемент <article>:

<html>
<head>
<style>
.all-browsers {
  margin: 0;
  padding: 5px;
  background-color: lightgray;
}

.all-browsers > h1, .browser {
  margin: 10px;
  padding: 5px;
}

.browser {
  background: white;
}

.browser > h2, p {
  margin: 4px;
  font-size: 90%;
}
</style>
</head>
<body>

<article class="all-browsers">
  <h1>Самые популярные браузеры</h1>
  <article class="browser">
    <h2>Google Chrome</h2>
    <p>Google Chrome - это веб-браузер, разработанный компанией Google и выпущенный в 2008 году. Chrome - это самый популярный веб браузер в мире на сегодняшний день!</p>
  </article>
  <article class="browser">
    <h2>Mozilla Firefox</h2>
    <p>Mozilla Firefox - это веб-браузер с открытым исходным кодом, разработанный компанией Mozilla. Firefox стал вторым по популярности веб браузером с января 2018 года.</p>
  </article>
  <article class="browser">
    <h2>Microsoft Edge</h2>
    <p>Microsoft Edge - это веб браузер, разработанный компанией Microsoft и выпущенный в 2015 году. Microsoft Edge заменил Internet Explorer.</p>
  </article>
</article>

</body>
</html>
Попробуйте сами »

Связанные страницы <article>

HTML DOM справочник: Объект article


Настройки CSS по умолчанию <article>

Большинство браузеров будут отображать элемент <article> со следующими значениями по умолчанию:

article {
  display: block;
}