All HTML Tags for CBSE Class 9, Complete List with Examples

Complete list of HTML tags for CBSE Class 9 ICT with examples and output. Covers heading, paragraph, formatting, image, link, and list tags.

HTML (HyperText Markup Language) is the standard language used to create web pages. In CBSE Class 9 ICT, you need to know all the basic HTML tags, their attributes, and how to use them. This post gives you every tag you need with clear examples.

What is HTML?

HTML stands for HyperText Markup Language. It is not a programming language but a markup language that uses tags to structure content on web pages.

Key points:

HTML files have the extension .html or .htm
HTML tags are enclosed in angle brackets < >
Most tags come in pairs: opening tag and closing tag, The closing tag has a forward slash /

Structure of an HTML Document

Every HTML page follows this basic structure:

<!DOCTYPE html>
<html>
<head>
    <title>My First Web Page</title>
</head>
<body>
    <h1>Welcome to My Page</h1>
    <p>This is my first web page.</p>
</body>
</html>

Tag	Purpose
`<!DOCTYPE html>`	Declares the document type
`<html>`	Root element of the page
`<head>`	Contains meta information
`<title>`	Sets the browser tab title
`<body>`	Contains visible content

Heading Tags (h1 to h6)

HTML provides six levels of headings. <h1> is the largest and <h6> is the smallest.

<h1>Heading 1 - Largest</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6 - Smallest</h6>

Exam tip: Remember that there are exactly 6 heading levels. Using <h7> will not work as a heading.

Paragraph and Line Break Tags

<p>This is a paragraph. It adds space before and after the text.</p>
<p>This is another paragraph.</p>

This line has a break here.<br>
This text appears on the next line.

Tag	Purpose	Closing Tag?
`<p>`	Creates a paragraph	Yes (`</p>`)
`<br>`	Inserts a line break	No (self-closing)
`<hr>`	Inserts a horizontal rule	No (self-closing)

Text Formatting Tags

These tags change how text appears on the page:

<b>This text is bold</b>
<i>This text is italic</i>
<u>This text is underlined</u>
<s>This text is strikethrough</s>
<sup>Superscript</sup> - like in x<sup>2</sup>
<sub>Subscript</sub> - like in H<sub>2</sub>O
<big>This text is bigger</big>
<small>This text is smaller</small>
<strong>This text is strong (bold)</strong>
<em>This text is emphasized (italic)</em>

Output examples:

x2 displays as x with a raised 2, H2O displays as H with a lowered 2 followed by O

Tag	Effect	Semantic?
`<b>`	Bold text	No
`<strong>`	Bold text	Yes (important text)
`<i>`	Italic text	No
`<em>`	Italic text	Yes (emphasized text)
`<u>`	Underlined text	No
`<s>`	Strikethrough	No
`<sup>`	Superscript	No
`<sub>`	Subscript	No

Font Tag and Attributes

The <font> tag is used to change text appearance (though it is deprecated in modern HTML, CBSE still includes it in the syllabus):

<font face="Arial" size="5" color="red">
    This is red Arial text of size 5
</font>

<font face="Times New Roman" size="3" color="blue">
    This is blue Times New Roman text
</font>

<font color="#FF5733">
    This text uses a hex color code
</font>

Attribute	Purpose	Values
`face`	Font family	Arial, Verdana, Times New Roman
`size`	Font size	1 (smallest) to 7 (largest)
`color`	Font color	Color name or hex code

Comment Tag

Comments are not displayed on the web page but help developers understand the code:

<!-- This is a comment -->
<!-- This will not be displayed on the page -->
<p>This paragraph is visible.</p>
<!-- <p>This paragraph is hidden inside a comment.</p> -->

Image Tag

The <img> tag is used to embed images. It is a self-closing tag.

<img src="flower.jpg" alt="A beautiful flower" width="300" height="200">

<img src="images/logo.png" alt="School Logo" border="2">

Attribute	Purpose
`src`	Path to the image file (required)
`alt`	Alternative text if image cannot load (required)
`width`	Width of the image in pixels
`height`	Height of the image in pixels
`border`	Border thickness around the image
`align`	Alignment (left, right, center)

Anchor (Link) Tag

The <a> tag creates hyperlinks to other pages or websites:

<!-- Link to another website -->
<a href="https://www.google.com">Visit Google</a>

<!-- Link to another page in the same folder -->
<a href="about.html">About Us</a>

<!-- Link that opens in a new tab -->
<a href="https://www.google.com" target="_blank">Open Google in New Tab</a>

<!-- Email link -->
<a href="mailto:student@example.com">Send Email</a>

Attribute	Purpose	Values
`href`	Destination URL	Any valid URL or file path
`target`	Where to open the link	`_blank` (new tab), `_self` (same tab)
`title`	Tooltip text on hover	Any text

Body Tag Attributes

The <body> tag supports several attributes to set page appearance:

<body bgcolor="lightyellow" text="darkblue" link="red" alink="green" vlink="purple" background="bg.jpg">
    <p>Page content goes here.</p>
</body>

Attribute	Purpose
`bgcolor`	Background color of the page
`text`	Default text color
`background`	Background image
`link`	Color of unvisited links
`alink`	Color of active (clicked) links
`vlink`	Color of visited links
`leftmargin`	Left margin of the page
`topmargin`	Top margin of the page

Center and Div Tags

<center>
    <h1>This heading is centered</h1>
    <p>This paragraph is also centered.</p>
</center>

<div align="right">
    <p>This text is right-aligned.</p>
</div>

Pre Tag (Preformatted Text)

The <pre> tag preserves spaces and line breaks exactly as written in the code:

<pre>
    Name     Age    City
    Aman     15     Delhi
    Priya    14     Mumbai
    Rahul    15     Kolkata
</pre>

Marquee Tag

The <marquee> tag creates scrolling text:

<marquee>This text scrolls from right to left</marquee>

<marquee direction="up" scrollamount="3">
    This text scrolls upward
</marquee>

Attribute	Purpose	Values
`direction`	Scroll direction	left, right, up, down
`scrollamount`	Speed of scrolling	Any number
`behavior`	Type of scrolling	scroll, slide, alternate
`bgcolor`	Background color	Color name or hex code

Complete Tag Reference Table

Tag	Purpose	Self-Closing?
`<html>`	Root element	No
`<head>`	Document metadata	No
`<title>`	Page title	No
`<body>`	Page content	No
`<h1>` to `<h6>`	Headings	No
`<p>`	Paragraph	No
`<br>`	Line break	Yes
`<hr>`	Horizontal rule	Yes
`<b>`, `<strong>`	Bold text	No
`<i>`, `<em>`	Italic text	No
`<u>`	Underline	No
`<sup>`	Superscript	No
`<sub>`	Subscript	No
`<font>`	Text formatting	No
`<img>`	Image	Yes
`<a>`	Hyperlink	No
`<center>`	Center content	No
`<pre>`	Preformatted text	No
`<marquee>`	Scrolling text	No
`<!-- -->`	Comment	N/A

Exam Tips

Always remember the basic structure: <html>, <head>, <title>, <body>
Know the difference between <b> and <strong> - both make text bold but <strong> adds semantic meaning
The <img> and <br> tags do not have closing tags
Practice writing complete HTML pages by hand, this is often asked in exams
Remember all attributes of <font>, <img>, and <a> tags as they are frequently tested

Make sure you can write HTML code from scratch without looking at notes. The best way to prepare is to type out these examples in a text editor, save them as .html files, and open them in a browser to see the output.