How to specify the main content of a document in HTML5 ?️‍🔥

Q: How to specify the main content of a document in HTML5 ?

The <article> tag is one of the new sectioning element in HTML5. The HTML article tag is used to represent an article. More specifically, the content within the <article> tag is independent of the other content of the site (even though it can be related).

The <article> tag is one of the new sectioning element in HTML5. The HTML article tag is used to represent an article. More specifically, the content within the <article> tag is independent of the other content of the site (even though it can be related).

In other words, the article element represents the component of a page that consists of self-contained composition in a document, page, or site.

Example 1:

<!DOCTYPE html> 
<html> 
  
<head> 
    <title> 
        Specify the main content of a  
        document using HTML5 
    </title> 
</head> 
  
<body> 
    <h2>w3wiki</h2> 
  
    <h2> 
        HTML5: How to specify the  
        main content of a document 
    </h2> 
  
  
    <article style="width: 300px;  
                    border: 2px solid gray;  
                    padding: 10px;  
                    border-radius: 10px; 
                    margin: 5px;"> 
  
        <img src= 
"https://media.w3wiki.net/wp-content/cdn-uploads/20190710102234/download3.png"
            alt="Beginner" width="300" height="250" 
            class="alignnone size-medium wp-image-560930" /> 
  
        <h1>w3wiki</h1> 
  
        <p> 
            Sandeep Jain(FOUNDER) An IIT Roorkee  
            alumnus and founder of w3wiki. 
            Apart from w3wiki, he has worked 
            with DE Shaw and Co. as a software developer 
            and JIIT Noida as an assistant professor. 
        </p> 
    </article> 
</body> 
  
</html>        

Output:

Example 2:

<!DOCTYPE html> 
<html> 
  
<head> 
    <meta charset="utf-8" /> 
  
    <title> 
        Specify the main content of  
        a document using HTML5 
    </title> 
</head> 
  
<body> 
    <h2>w3wiki</h2> 
    <h2> 
        HTML5: How to specify the  
        main content of a document? 
    </h2> 
  
    <article> 
        <h1>search engines</h1> 
  
        <p> 
            Google, Bing, and Yahoo! are the  
            most used search engines today. 
        </p> 
  
        <h1>Google</h1> 
        <p> 
            The world's most popular  
            search engine. 
        </p> 
  
        <h1>Bing</h1> 
        <p> 
            Microsoft's entry into the  
            burgeoning search engine  
            market. Better late than  
            never. 
        </p> 
  
        <h1>Yahoo!</h1> 
        <p> 
            The 2nd largest search  
            engine on the web 
        </p> 
    </article> 
</body> 
  
</html> 

Output: