САМОСТОЯТЕЛЬНОЕ ОБУЧЕНИЕ ДЛЯ ВЕБ РАЗРАБОТЧИКОВ

Спасибо за поддержку, сайт продолжает работать

HTML Тег <main>



Пример

Укажите основное содержание документа:

<main>
  <h1>Самые популярные браузеры</h1>
  <p>Chrome, Firefox, и Edge являются наиболее часто используемыми браузерами сегодня.</p>

 <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>
</main>
Попробуйте сами »

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

Тег <main> определяет основное содержимое документа.

Содержание внутри элемента <main> должен быть уникальным для документа. Он не должен содержать никакого контента, который повторяется в документах, таких как боковая панель, навигационные ссылки, информация об авторских правах, логотипы сайтов и поисковые формы.

Примечание: Их не должно быть больше одного элемента <main> в документе. Элемент <main> элемент не должен быть потомком какого-либо элемента <article>, <aside>, <footer>, <header>, или <nav>.


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

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

Элемент
<main> 26.0 12.0 21.0 7.0 16.0

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

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


События атрибутов

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



Еще примеры

Пример

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

<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>Самые популярные браузеры</h1>
  <p>Chrome, Firefox и Edge сегодня являются наиболее часто используемыми браузерами.</p>
  <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>
</main>

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