<section>

HTML-элемент <section> представляет собой автономный раздел — который не может быть представлен более точным по семантике элементом — внутри HTML-документа. Как правило, но не всегда, разделы имеют заголовок.

Например, меню навигации должно быть помещено в элемент <nav>, но список результатов поиска и отображение карты с ее элементами управления не имеют специфических элементов и могут быть помещены в <section>.

Заметка: Если содержимое элемента имеет смысл объединить как единое целое (в цельный и независимый блок), то элемент <article> может стать лучшим выбором.

Категории контента Основной поток, секционный контент, явный контент.
Разрешенное содержимое Основной поток
Пропуск тега Ни одного; Оба тега, открывающий и закрывающий, являются обязательными.
Разрешенные родительские элементы Любой элемент, который разрешает контент основного потока в качестве содержимого. Обратите внимание, что элемент <section> не должен быть потомком элемента <address>.
Разрешенные роли ARIA alert, alertdialog, application, banner, complementary, contentinfo, dialog, document, feed, log, main, marquee, navigation, search, status, tabpanel
DOM-интерфейс HTMLElement

Атрибуты

К этому элементу применимы только глобальные атрибуты.

Примечание

  • Каждый элемент <section> должен быть идентифицирован, обычно путем добавления заголовка (элементы <h1>-<h6>) в качестве дочернего элемента.
  • Если имеет смысл по-особому объединить содержимое элемента <section> (например, сделать цельным и независимым разделом HTML-документа), используйте вместо него элемент <article>.
  • Не используйте элемент <section> как общий контейнер; для этого есть <div>, особенно когда секционирование применяется только для стилизации. На практике раздел должен логически выделяться в структуре документа.

Пример 1

До

<div>
  <h1>Заголовок</h1>
  <p>Много замечательного контента</p>
</div>

После

<section>
  <h1>Заголовок</h1>
  <p>Много замечательного контента</p>
</section>

Пример 2

До

<div>
  <h2>Заголовок</h2>
  <img src="bird.jpg" alt="птица">
</div>

После

<section>
  <h2>Заголовок</h2>
  <img src="bird.jpg" alt="птица">
</section>

Спецификации

Спецификация Статус Комментарий
HTML Living Standard
Определение '<section>' в этой спецификации.		 Живой стандарт
HTML 5.1
Определение '<section>' в этой спецификации.		 Рекомендация
HTML5
Определение '<section>' в этой спецификации.		 Рекомендация

Поддержка браузерами

Update compatibility data on GitHub
КомпьютерыМобильные
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome для AndroidFirefox для AndroidOpera для AndroidSafari on iOSSamsung Internet
sectionChrome Полная поддержка 5Edge Полная поддержка 12Firefox Полная поддержка 4IE Полная поддержка 9Opera Полная поддержка 11.1Safari Полная поддержка 4.1WebView Android Полная поддержка ДаChrome Android Полная поддержка ДаFirefox Android Полная поддержка 4Opera Android Полная поддержка 11.1Safari iOS Полная поддержка 4.2Samsung Internet Android Полная поддержка Да

Легенда

Полная поддержка  
Полная поддержка

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

Связанные темы
  1. HTML элементы
    1. A
      1. <a>
      2. <abbr>
      3. <acronym>
      4. <address>
      5. <applet>
      6. <area>
      7. <article>
      8. <aside>
      9. <audio>
    2. B
      1. <b>
      2. <base>
      3. <basefont>
      4. <bdi>
      5. <bdo>
      6. <bgsound>
      7. <big>
      8. <blink>
      9. <blockquote>
      10. <body>
      11. <br>
      12. <button>
    3. C
      1. <canvas>
      2. <caption>
      3. <center>
      4. <cite>
      5. <code>
      6. <col>
      7. <colgroup>
      8. <content>
    4. D
      1. <data>
      2. <datalist>
      3. <dd>
      4. <del>
      5. <details>
      6. <dfn>
      7. <dialog>
      8. <dir>
      9. <div>
      10. <dl>
      11. <dt>
    5. E
      1. <em>
      2. <embed>
    6. F
      1. <fieldset>
      2. <figcaption>
      3. <figure>
      4. <font>
      5. <footer>
      6. <form>
      7. <frame>
      8. <frameset>
    7. G H
      1. <h1>
      2. <h2>
      3. <h3>
      4. <h4>
      5. <h5>
      6. <h6>
      7. <head>
      8. <header>
      9. <hgroup>
      10. <hr>
      11. <html>
    8. I
      1. <i>
      2. <iframe>
      3. <img>
      4. <input>
      5. <ins>
      6. <isindex>
    9. J K
      1. <kbd>
      2. <keygen>
    10. L
      1. <label>
      2. <legend>
      3. <li>
      4. <link>
      5. <listing>
    11. M
      1. <main>
      2. <map>
      3. <mark>
      4. <marquee>
      5. <menu>
      6. <menuitem>
      7. <meta>
      8. <meter>
    12. N
      1. <nav>
      2. <nobr>
      3. <noframes>
      4. <noscript>
    13. O
      1. <object>
      2. <ol>
      3. <optgroup>
      4. <option>
      5. <output>
    14. P
      1. <p>
      2. <param>
      3. <picture>
      4. <plaintext>
      5. <pre>
      6. <progress>
    15. Q
      1. <q>
    16. R
      1. <rp>
      2. <rt>
      3. <rtc>
      4. <ruby>
    17. S
      1. <s>
      2. <samp>
      3. <script>
      4. <section>
      5. <select>
      6. <shadow>
      7. <slot>
      8. <small>
      9. <source>
      10. <spacer>
      11. <span>
      12. <strike>
      13. <strong>
      14. <style>
      15. <sub>
      16. <summary>
      17. <sup>
    18. T
      1. <table>
      2. <tbody>
      3. <td>
      4. <template>
      5. <textarea>
      6. <tfoot>
      7. <th>
      8. <thead>
      9. <time>
      10. <title>
      11. <tr>
      12. <track>
      13. <tt>
    19. U
      1. <u>
      2. <ul>
    20. V
      1. <var>
      2. <video>
    21. W
      1. <wbr>
    22. X Y Z
      1. <xmp>