Tag <main> HTML


Contoh

Tentukan konten utama dokumen:

<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>

Lebih banyak contoh "Coba Sendiri" di bawah ini.


Definisi dan Penggunaan

Tag <main>menentukan konten utama dari sebuah dokumen.

Konten di dalam <main>elemen harus unik untuk dokumen. Itu tidak boleh berisi konten apa pun yang diulang di seluruh dokumen seperti bilah sisi, tautan navigasi, informasi hak cipta, logo situs, dan formulir pencarian.

Catatan: Tidak boleh ada lebih dari satu <main>elemen dalam dokumen. Elemen <main>TIDAK boleh turunan dari elemen <article>, <aside>, <footer>, <header>, atau <nav>.


Dukungan Peramban

Angka-angka dalam tabel menentukan versi browser pertama yang sepenuhnya mendukung elemen tersebut.

Element
<main> 26.0 12.0 21.0 7.0 16.0

Atribut Global

Tag <main>juga mendukung Atribut Global dalam HTML .


Atribut Acara

Tag <main>juga mendukung Atribut Peristiwa dalam HTML .



Lebih Banyak Contoh

Contoh

Gunakan CSS untuk menata elemen <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>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>