HTML <main> Tag

In this blog we will learn about HTML <main> Tag HTML <main> Tag is used to represent the main content of <body> Tag.The <main> Tag is placed inside the <body> Tag. It is used to accurately describe the primary content of a page. The content of the main tag is directly related to the central topic of the document.

HTML <main> Tag is a new tag and was introduced in HTML5.

Note:- An author should not include more than one <main> Tag in a document.The <main> element must not be used as a child of an <article>, <aside>, <header>, <footer>, or <nav> element.

Example:-

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>HTML Main Tag</title>
</head>
 
<body>
  <h1>This is HTML Main Tag</h1>
<main>  
<article>
  <h2>Title 1</h2>
  Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
  tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
  quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
  consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
  cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
  proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</article> 
 <article>
  <h2>Title 2</h2>
  Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
  tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
  quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
  consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
  cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
  proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</article>
<article>
  <h2>Title 3</h2>
  Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
  tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
  quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
  consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
  cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
  proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</article>
</main>    
</body>
</html>

Output:-


Related Posts

Leave a Reply

Your email address will not be published. Required fields are marked *