HTML <main> Tag


Example

Specify the main content of the document:

<main>
  <h1>Most Popular Browsers</h1>
  <p>Chrome, Firefox, and      Edge are the most used browsers today.</p>

    <article>
    <h2>Google Chrome</h2>
    <p>Google Chrome is a web browser    developed by Google, released in 2008. Chrome is the world's most popular web    browser today!</p>
  </article>

  <article>
    <h2>Mozilla    Firefox</h2>
    <p>Mozilla Firefox is an open-source web browser developed by    Mozilla. Firefox has been the second most popular web browser since January,    2018.</p>
  </article>

  <article>
    <h2>Microsoft Edge</h2>
         <p>Microsoft Edge is a web browser developed by Microsoft, released in 2015.    Microsoft Edge replaced Internet Explorer.</p>
  </article>
</main>
Виж примера

More "Try it Yourself" examples below.

Definition and Usage

The <main> tag specifies the main content of a document.

The content inside the <main> element should be unique to the document. It should not contain any content that is repeated across documents such as sidebars, navigation links, copyright information, site logos, and search forms.

Note: There must not be more than one <main> element in a document. The <main> element must NOT be a descendant of an <article>, <aside>, <footer>, <header>, or <nav> element.

Browser Support

The numbers in the table specify the first browser version that fully supports the element.

Element
<main> 26.0 12.0 21.0 7.0 16.0

Global Attributes

The <main> tag also supports the Global Attributes in HTML.

Event Attributes

The <main> tag also supports the Event Attributes in HTML.

More Examples

Example

Use CSS to style the <main> element:

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

main    > h1, p, .browser {
  margin: 10px;
  padding: 5px;
}

   .browser {
  background: white;
}

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

<main>
  <h1>Most    Popular Browsers</h1>
  <p>Chrome, Firefox, and Edge are the    most used browsers today.</p>
  <article class="browser">
       <h2>Google Chrome</h2>
    <p>Google Chrome is a web browser    developed by Google, released in 2008. Chrome is the world's most popular web    browser today!</p>
  </article>
  <article class="browser">
       <h2>Mozilla Firefox</h2>
    <p>Mozilla Firefox is an    open-source web browser developed by Mozilla. Firefox has been the second most    popular web browser since January, 2018.</p>
  </article>
     <article class="browser">
    <h2>Microsoft Edge</h2>
       <p>Microsoft Edge is a web browser developed by Microsoft, released in 2015.    Microsoft Edge replaced Internet Explorer.</p>
  </article>
   </main>

</body>
</html>
Виж примера