0% found this document useful (0 votes)
2 views5 pages

HTML_Tags_with_Examples

This document provides a comprehensive overview of various HTML tags and their practical uses, including structural elements like <html>, <head>, and <body>, as well as content-related tags such as <h1>, <p>, and <a>. Each tag is accompanied by a brief description and an example of its usage. The document serves as a useful reference for understanding HTML syntax and structure.

Uploaded by

mr.mamunur6.7
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
2 views5 pages

HTML_Tags_with_Examples

This document provides a comprehensive overview of various HTML tags and their practical uses, including structural elements like <html>, <head>, and <body>, as well as content-related tags such as <h1>, <p>, and <a>. Each tag is accompanied by a brief description and an example of its usage. The document serves as a useful reference for understanding HTML syntax and structure.

Uploaded by

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

HTML Tags with Practical Uses

<html>
Root element of an HTML document.
Example:
<html>
...
</html>

<head>
Container for metadata.
Example:
<head>
<title>Page Title</title>
</head>

<title>
Defines the title of the document.
Example:
<title>My Website</title>

<body>
Contains the visible page content.
Example:
<body>
<h1>Welcome</h1>
</body>

<h1> to <h6>
Header tags from largest (<h1>) to smallest (<h6>).
Example:
<h1>Main Title</h1>

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

<a>
Defines a hyperlink.
Example:
<a href='https://example.com'>Visit</a>

<img>
Embeds an image.
Example:
<img src='image.jpg' alt='An image'>
HTML Tags with Practical Uses

<ul>, <ol>, <li>


Unordered/Ordered list and list items.
Example:
<ul><li>Item</li></ul>

<table>
Defines a table.
Example:
<table><tr><td>Data</td></tr></table>

<form>
Defines a form.
Example:
<form><input type='text'></form>

<input>
User input field.
Example:
<input type='text'>

<button>
Clickable button.
Example:
<button>Click me</button>

<div>
Generic container.
Example:
<div>Content</div>

<span>
Inline container.
Example:
<span>Text</span>

<br>
Line break.
Example:
First line<br>Second line

<hr>
Horizontal rule.
Example:
<hr>

<strong>, <b>
HTML Tags with Practical Uses
Bold text.
Example:
<strong>Important</strong>

<em>, <i>
Italic text.
Example:
<em>Note</em>

<meta>
Metadata.
Example:
<meta charset='UTF-8'>

<link>
External resources like CSS.
Example:
<link rel='stylesheet' href='style.css'>

<script>
JavaScript code.
Example:
<script>alert('Hi');</script>

<style>
CSS in HTML.
Example:
<style>body {color: red;}</style>

<section>
Defines a section.
Example:
<section><h2>Header</h2></section>

<article>
Self-contained content.
Example:
<article><h2>Title</h2></article>

<aside>
Sidebar content.
Example:
<aside>Note</aside>

<nav>
Navigation links.
HTML Tags with Practical Uses
Example:
<nav><a href='/'>Home</a></nav>

<header>
Document or section header.
Example:
<header><h1>Logo</h1></header>

<footer>
Footer content.
Example:
<footer>© 2025</footer>

<main>
Main content.
Example:
<main><p>Main info</p></main>

<figure>, <figcaption>
Image with caption.
Example:
<figure><img src='img.jpg'><figcaption>Caption</figcaption></figure>

<mark>
Highlight text.
Example:
<mark>Important</mark>

<code>
Code text.
Example:
<code>console.log()</code>

<pre>
Preformatted text.
Example:
<pre> Indented</pre>

<sup>, <sub>
Superscript and subscript.
Example:
H<sub>2</sub>O

<small>
Small print.
Example:
HTML Tags with Practical Uses
<small>Disclaimer</small>

<time>
Time/date.
Example:
<time datetime='2025-04-20'>April 20</time>

<details>, <summary>
Expandable content.
Example:
<details><summary>More</summary><p>Hidden</p></details>

<canvas>
Draw graphics.
Example:
<canvas id='myCanvas'></canvas>

<svg>
Vector graphics.
Example:
<svg><circle cx='50' cy='50' r='40'/></svg>

<template>
Client-side template.
Example:
<template><p>Template</p></template>

You might also like