HTML main tag

HTML main tag

Well, as the name of the tag suggests, it is used to specify the main(dominant) content in the document. We can say that the main element contains the dominating content of the body of the document. The content of the main element is supposed to be unique throughout the document.

Let’s have a look at some examples right now so that we have a brief idea about using the main tag →

<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<meta http-equiv=”X-UA-Compatible” content=”IE=edge”>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
<title>Some heading…</title>
</head>
<body>
<h1>This is some main content</h1>
<main>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Ducimus quidem harum dolorum repudiandae nostrum sint earum. Debitis maiores qui dolores, quas repellendus neque cupiditate optio molestiae pariatur error itaque dignissimos.
Nostrum ipsam voluptates quis laudantium autem eligendi ab, doloribus quibusdam reiciendis, natus adipisci quod ut? Amet est ut ratione hic autem corporis adipisci aliquam excepturi maxime consectetur? Et, eius enim?
Debitis porro provident similique earum pariatur quia iste omnis dolores quisquam quis animi est eos, qui eveniet cumque quos? Esse dolorem aut neque consectetur id doloremque corrupti exercitationem amet quia!
Beatae ea id accusamus dolorum corporis accusantium, voluptates eum tenetur pariatur ratione cum quisquam ullam. Id voluptate pariatur quia, cumque, suscipit adipisci praesentium corporis perferendis quidem dolor fugit reiciendis aliquid?
Pariatur ullam vel ducimus voluptate provident repudiandae delectus ad harum? Quo, ipsa repudiandae totam ullam aliquam numquam dicta excepturi repellendus accusantium consequuntur porro dignissimos placeat possimus! Animi doloribus odit repudiandae?</main>
</body>
</html>

If we try to open the file in the browser, the output is something like this –