Scribd
Upload
11 views

HTML5_Tags_with_Examples

Uploaded by

Muthamil0593
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
11 views

HTML5_Tags_with_Examples

Uploaded by

Muthamil0593
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 5

<!DOCTYPE html>: Declares the document type as HTML5.

Example:
<!DOCTYPE html>

<html>: Root element that contains all HTML content.


Example:
<html>
<head></head>
<body></body>
</html>

<head>: Container for metadata, such as title, links, and scripts.


Example:
<head>
<title>Page Title</title>
<meta charset="UTF-8">
</head>

<body>: Defines the main content area of the HTML document.


Example:
<body>
<h1>Welcome to My Website</h1>
</body>

<h1> to <h6>: Headings, with <h1> being the largest and <h6> the smallest.
Example:
<h1>Main Heading</h1>
<h2>Subheading</h2>

<p>: Paragraph tag.


Example:
<p>This is a paragraph.</p>

<br>: Line break.


Example:
<p>First line<br>Second line</p>

<hr>: Horizontal rule, often used to separate content.


Example:
<p>Content above</p>
<hr>
<p>Content below</p>

<header>: Represents introductory content or a group of navigational links.


Example:
<header>
<h1>Welcome</h1>
<nav>
<a href="#">Home</a> | <a href="#">About</a>
</nav>
</header>

<footer>: Defines footer content, often including copyright or related information.


Example:
<footer>
<p>&copy; 2025 My Website</p>
</footer>
<main>: Represents the main content of the document.
Example:
<main>
<h2>Main Content Area</h2>
<p>This is the primary section of the page.</p>
</main>

<article>: Self-contained content like blog posts or articles.


Example:
<article>
<h2>Article Title</h2>
<p>Article content goes here.</p>
</article>

<section>: Defines thematic groups of content.


Example:
<section>
<h2>About Us</h2>
<p>Information about the organization.</p>
</section>

<nav>: Contains navigation links.


Example:
<nav>
<a href="home.html">Home</a> | <a href="contact.html">Contact</a>
</nav>

<aside>: Represents additional or side content.


Example:
<aside>
<h4>Related Links</h4>
<ul>
<li><a href="#">Link 1</a></li>
<li><a href="#">Link 2</a></li>
</ul>
</aside>

<div>: Generic container for grouping and styling content.


Example:
<div class="container">
<p>This is a styled container.</p>
</div>

<a>: Anchor tag, used for hyperlinks.


Example:
<a href="https://example.com">Visit Example</a>

<img>: Embeds images in the document.


Example:
<img src="image.jpg" alt="Description of the image">

<video>: Embeds video files with controls.


Example:
<video controls>
<source src="video.mp4" type="video/mp4">
</video>

<audio>: Embeds audio files with controls.


Example:
<audio controls>
<source src="audio.mp3" type="audio/mpeg">
</audio>

<ul>: Unordered list.


Example:
<ul>
<li>Item 1</li>
<li>Item 2</li>
</ul>

<ol>: Ordered list.


Example:
<ol>
<li>First item</li>
<li>Second item</li>
</ol>

<form>: Creates an HTML form for user input.


Example:
<form action="/submit" method="post">
<label for="name">Name:</label>
<input type="text" id="name" name="name">
<button type="submit">Submit</button>
</form>

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Nested List Example</title>

</head>
<body>
<ol>
<li>Sem 1
<ul>
<li>Maths</li>
<li>Physics</li>
<li>Labs:
<ul>
<li>CHY Lab</li>
<li>PHY Lab</li>
</ul>
</li>
</ul>
</li>

<li>Sem 2
<ul>
<li>C Programming</li>
<li>Electronics</li>
<li>Labs:
<ul>
<li>CP Lab</li>
<li>ELC Lab</li>
</ul>
</li>
</ul>
</li>

<li>Sem 3
<ul>
<li>Data Structures</li>
<li>Database Systems</li>
<li>Labs:
<ul>
<li>DS Lab</li>
<li>DBS Lab</li>
</ul>
</li>
</ul>
</li>

<li>Sem 4
<ul>
<li>Algorithms</li>
<li>Operating Systems</li>
<li>Labs:
<ul>
<li>ALGO Lab</li>
<li>OS Lab</li>
</ul>
</li>
</ul>
</li>
</ol>
</body>
</html>

You might also like