<main>

HTML елементът <main>  представя основното съдържание на частта <body> на документа, на негова част или на приложението. Тази зона, предназначена за основното съдържание, се състои от информация, която е пряко свързана с главната тема на документа или основната функционалност на приложението, или пък я допълва. Ако е необходимо, бихте могли да използвате няколко  <main> елемента в една и съща страница.  Например, когато имате  страница, която презентира няколко статии - всяка от които в собствен <article> елемент и всяка една от тях има допълнителни материали в себе си (като лента с инструменти за обработка, реклами и т.н.). В такъв случай, има смисъл да включите <main> елемент във всяка една статия, за да можете да обособите водещото съдържание за всяка конкретна статия.
Content categories Flow content, palpable content.
Permitted content Flow content.
Tag omission None; both the starting and ending tags are mandatory.
Permitted parents Any element that accepts flow content (WHATWG). However, the W3C specification doesn't permit <main> to be used as a descendant of  <article>, <aside>, <footer>, <header>, or <nav>.
Permitted ARIA roles The main role is applied to <main> by default, and the presentation role is permitted as well.
DOM interface HTMLElement

Атрибути

Този елемент може да съдържа само глобалните атрибути (global attributes).

Бележки за употребата

Съдържанието на елемента  <main> трябва да бъде уникално за документа или за частта, която го съдържа. Съдържание, което е повтарящо се през съответния набор от документи или частите на документа като: странични ленти, линкове за навигация, информация за правата, лога на сайта и форми за търсене не бива да са включени, освен ако формата за търсене не е основната функционалност на страницата.

<main> не допринася за схемата на документа. За разлика от елементи като <body>, заглавия  <h2>, и други, <main> не влияе на DOM концепцията за структуриране на страницата. Функцията на този елемент е стриктно информативна.

Разлики между WHATWG и W3C спецификациите

Дефиницията на елемента <main> е значително различна между стандарта WHATWG's living standard (спецификациите, които MDN по споразумение) и the W3C specification. Ето разликите между двете спецификации по примерите, дадени по-горе:

  • Стандартът за HTML WHATWG позволява няколко елемента <main> на една страница, докато версията на  the W3C version of the specification не позволява. Прави изключение случаят в който освен един, всички останали елементи <main> са скрити посредством атрибута hidden.
  • Спецификацията WHATWG разрешава <main>да бъде използван навсякъде, където е позволено да има flow content . Противно на това, версията на W3C не позволява  <main> да е вложен в <article>, <aside>, <footer>, <header> или <nav>.

Изглеждат много малко разликите, но елементът <main> е сравнително прост на функционално ниво. Ако се игнорират тези разлики, то те биха могли да доведат до значителни последици.

Пример

<!-- other content -->

<main>
  <h1>Apples</h1>
  <p>The apple is the pomaceous fruit of the apple tree.</p>
  
  <article>
    <h2>Red Delicious</h2>
    <p>These bright red apples are the most common found in many
    supermarkets.</p>
    <p>... </p>
    <p>... </p>
  </article>

  <article>
    <h2>Granny Smith</h2>
    <p>These juicy, green apples make a great filling for
    apple pies.</p>
    <p>... </p>
    <p>... </p>
  </article>
</main>

<!-- other content -->

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

Спецификация Статус Коментар
HTML Living Standard
The definition of '<main>' in that specification.		 Living Standard Премахва органичението <main> да не бъде използван няколко пъти в документ или като вложен в елемента <article>.
HTML 5.1
The definition of '<main>' in that specification.		 Recommendation Без промяна от HTML5.
HTML5
The definition of '<main>' in that specification.		 Recommendation Initial definition.

Съвместимост с браузърите

Елементът <main> е широко поддържан. За Internet Explorer 11 и надолу, е препоръчително да се добави ARIA role of "main" kym elementa <main> , за да се подсигурите, че е достъпен(екранни четци като JAWS, използвани със стари версии на Internet Explorer, ще могат да разберат семантичното значение на елемента <main>, когато този атрибут role бъде добавен).

<main role="main">
  ...
</main>
Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
mainChrome Full support 26Edge Full support 12Firefox Full support 21IE No support NoOpera Full support 16Safari Full support 7WebView Android Full support YesChrome Android Full support YesFirefox Android Full support 21Opera Android Full support YesSafari iOS Full support 7Samsung Internet Android Full support Yes

Legend

Full support  
Full support
No support  
No support

Виж също

Свързани теми
  1. <main>
  2. HTML Elements
    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>