Show List
Tutorials > HTML > HTML Tags and Elements

HTML Tags and Elements

HTML tags are used to define the structure and content of a web page. Here are some of the most commonly used basic HTML tags:

<html>

Encloses the complete HTML document.
 
<!DOCTYPE html>
<html>

<head>
    Header tags go here
</head>

<body>
    Body tags go here
</body>

</html>

<head>

Represents document header and contains tags like title, meta tags and links.

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>Sample HTML Page</title>
    <meta name="description" content="Description of the page">
    <meta name="keywords" content="Sample, HTML">
    <meta name="author" content="Author's Name">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>

<body>
    Body tags go here
</body>

</html>

<body>

Represents document body and contains tags like <div>, <p>, <a>

<!DOCTYPE html>
<html>

<head>

</head>

<body>
    <h1 id="london">London</h1>
    <p>London, the capital of England and the United Kingdom, is a 21st-century city with history stretching back to
        Roman times.
    </p>
</body>

</html>
Output:
London
London, the capital of England and the United Kingdom, is a 21st-century city with history stretching back to Roman times.

<h1>, <h2>,<h3>

These are used to create headings of different styles
<!DOCTYPE html>
<html>

<head>
</head>

<body>
    <h1>New York</h1>
    <h2>London</h2>
    <h3>Tokyo</h3>
    <h4>Paris</h4>
</body>

</html>
Output:
New York
London
Tokyo
Paris

<p>

Used for paragraph
<!DOCTYPE html>
<html>

<head>
</head>

<body>
    <p>London, the capital of England and the United Kingdom, is a 21st-century city with history stretching back to
        Roman times.
    </p>
</body>

</html>
Output

London, the capital of England and the United Kingdom, is a 21st-century city with history stretching back to Roman times.

<br />

Used to insert a line break.
<!DOCTYPE html>
<html>

<head>
</head>

<body>
    Popular Tourist Destinations
    <br />
    <ul>
        <li><a href="#london">London</a></li>
        <li><a href="#paris">Paris</a></li>
        <li><a href="#tokyo">Tokyo</a></li>
    </ul>
</body>

</html>
Output

Popular Tourist Destinations

<hr />

Used to add a horizontal line

<!DOCTYPE html>
<html>

<head>
</head>

<body>
    <h1 id="london">London</h1>
    <hr />
    <p>London, the capital of England and the United Kingdom, is a 21st-century city with history stretching back to
      Roman times.
    </p>
</body>

</html>
Output

London
London, the capital of England and the United Kingdom, is a 21st-century city with history stretching back to Roman times.

<div>

Used for containing a division
<!DOCTYPE html>
<html>

<head>
</head>

<body>
    <div>First Division</div>
    <div>Second Division</div>
    <div>Third Division</div>
</body>

</html>

<a>

The <a> (anchor) tag is used to define hyperlink to link to another page or element of the same page.
<!DOCTYPE html>
<html>

<head>
</head>

<body>
    <a href="https://itcodescanner.com/?target=projectscanner">Tutorials Page</a>
</body>

</html>


Next: HTML attributes

    Leave a Comment

  • captcha text