Complete HTML Tags
Reference
meaning of word here
meaning of word here
Handout

Document Structure Tags

Tag	Purpose	Example	Status
`<!DOCTYPE html>`	Declares HTML5 document type	`<!DOCTYPE html>`	✅ Active
`<html>`	Root element of HTML document	`<html lang="en">...</html>`	✅ Active
`<head>`	Contains metadata about document	`<head>...</head>`	✅ Active
`<body>`	Contains visible content	`<body>...</body>`	✅ Active
`<meta>`	Provides metadata	`<meta charset="UTF-8">`	✅ Active
`<title>`	Sets page title (browser tab)	`<title>My Page</title>`	✅ Active

Heading Tags

Tag	Purpose	Example	Output Size
`<h1>`	Main heading (largest)	`<h1>Main Title</h1>`	Largest
`<h2>`	Secondary heading	`<h2>Subtitle</h2>`	Large
`<h3>`	Third level heading	`<h3>Section Title</h3>`	Medium
`<h4>`	Fourth level heading	`<h4>Subsection</h4>`	Small
`<h5>`	Fifth level heading	`<h5>Minor Heading</h5>`	Smaller
`<h6>`	Sixth level heading (smallest)	`<h6>Tiny Heading</h6>`	Smallest

Text Formatting Tags

Container Elements

Tag	Purpose	Example	Status
`<p>`	Paragraph	`<p>This is a paragraph.</p>`	✅ Active
`<div>`	Block-level container	`<div>Content here</div>`	✅ Active
`<span>`	Inline container	`<span style="color:red">Text</span>`	✅ Active
`<pre>`	Preformatted text (preserves spaces)	`<pre> Spaced text </pre>`	✅ Active

Physical Formatting Tags

Tag	Purpose	Example	Status
`<b>`	Bold text	`<b>Bold</b>`	✅ Active
`<i>`	Italic text	`<i>Italic</i>`	✅ Active
`<u>`	Underlined text	`<u>Underlined</u>`	✅ Active
`<s>`	Strikethrough	`<s>Crossed out</s>`	✅ Active
`<sub>`	Subscript	`H<sub>2</sub>O` → H₂O	✅ Active
`<sup>`	Superscript	`a<sup>2</sup>` → a²	✅ Active

Logical Formatting Tags

Tag	Purpose	Example	Status
`<em>`	Emphasized text (usually italic)	`<em>Important</em>`	✅ Active
`<strong>`	Strong importance (usually bold)	`<strong>Warning</strong>`	✅ Active
`<cite>`	Citation (book, movie titles)	`<cite>Ramayana</cite>`	✅ Active
`<abbr>`	Abbreviation with tooltip	`<abbr title="World Health Organization">WHO</abbr>`	✅ Active
`<code>`	Computer code (monospace)	`<code>print("Hello")</code>`	✅ Active
`<kbd>`	Keyboard input	`<kbd>Ctrl</kbd> + <kbd>C</kbd>`	✅ Active

Deprecated Formatting Tags

Tag	Purpose	Example	Status
`<center>`	Center-align content	`<center>Centered</center>`	❌ Deprecated
`<font>`	Font styling	`<font color="red" size="5">Text</font>`	❌ Deprecated
`<basefont>`	Default font for page	`<basefont size="4" color="blue">`	❌ Deprecated
`<tt>`	Teletype/typewriter font	`<tt>Fixed width</tt>`	❌ Deprecated

List Tags

Ordered Lists

Tag	Purpose	Example	Attributes
`<ol>`	Ordered list container	`<ol type="A">...</ol>`	`type="1,A,a,I,i"`
`<li>`	List item	`<li>First item</li>`	Used in all lists

Unordered Lists

Tag	Purpose	Example	Attributes
`<ul>`	Unordered list container	`<ul type="square">...</ul>`	`type="disc,circle,square"`

Definition Lists

Tag	Purpose	Example
`<dl>`	Definition list container	`<dl>...</dl>`
`<dt>`	Definition term	`<dt>HTML</dt>`
`<dd>`	Definition description	`<dd>Markup language</dd>`

HTML5 Semantic Elements

Tag	Purpose	Example	Usage
`<header>`	Page/section header	`<header><h1>Title</h1></header>`	Logo, title, navigation
`<footer>`	Page/section footer	`<footer><p>© 2025</p></footer>`	Copyright, contact info
`<nav>`	Navigation links	`<nav><a href="#">Home</a></nav>`	Menus, navigation bars
`<article>`	Independent content	`<article><h2>Blog Post</h2></article>`	Blog posts, news articles
`<section>`	Thematic grouping	`<section><h3>Chapter 1</h3></section>`	Chapters, sections
`<aside>`	Sidebar content	`<aside><h3>Related Links</h3></aside>`	Sidebars, advertisements

Special Tags

Tag	Purpose	Example	Notes
`<!-- -->`	Comments	`<!-- This is a comment -->`	Not visible in browser
`<br>`	Line break	`Line 1<br>Line 2`	Empty element
`<hr>`	Horizontal rule	`<hr>`	Empty element

Common Character Entities

Entity	Character	Description
`<`	<	Less than
`>`	>	Greater than
`&`	&	Ampersand
` `		Non-breaking space
`"`	"	Double quote
`'` or `'`	'	Single quote/apostrophe
`©`	©	Copyright
`®`	®	Registered trademark
`™`	™	Trademark
`₹`	₹	Indian Rupee
`€`	€	Euro

Body Attributes (Deprecated - Use CSS Instead)

Attribute	Purpose	Example	Modern Alternative
`bgcolor`	Background color	`<body bgcolor="lightblue">`	CSS: `background-color`
`link`	Link color	`<body link="blue">`	CSS: `a { color: blue; }`
`alink`	Active link color	`<body alink="red">`	CSS: `a:active { color: red; }`
`vlink`	Visited link color	`<body vlink="purple">`	CSS: `a:visited { color: purple; }`
`leftmargin`	Left margin	`<body leftmargin="50">`	CSS: `margin-left: 50px;`
`topmargin`	Top margin	`<body topmargin="30">`	CSS: `margin-top: 30px;`

Quick Tips for Exams

Remember These Key Points:

Container elements have opening and closing tags
Empty elements like <br>, <hr> don't have closing tags
Deprecated tags are replaced by CSS in modern HTML
Semantic elements improve SEO and accessibility
Always escape <, >, and & in text content
Use logical tags (<em>, <strong>) over physical tags (<i>, <b>) when meaning matters

HTML5 vs Older Versions:

✅ HTML5: Simple <!DOCTYPE html>
✅ Semantic elements: <header>, <footer>, <nav>, <article>, <section>, <aside>
❌ Deprecated: <font>, <center>, <basefont>, body attributes for styling

This handout covers all HTML tags discussed in your course materials. Print this for quick

reference
meaning of word here
meaning of word here

during studies and exams!

Back to Topics

Take the test