HTML (HyperText Markup Language) is the language used to create web pages. It is made of tags written in angle brackets — most come in pairs: an opening tag <p> and a closing tag </p>, with content in between. This chapter follows the CBSE 165 syllabus, so it includes classic tags like <font> that your exam expects (modern websites style with CSS instead — you'll meet CSS later in this unit).
1The skeleton of a web page
Every HTML page has the same basic structure — four tags that hold everything else:
<html>
<head>
<title>My Page</title>
</head>
<body>
... page content goes here ...
</body>
</html>| Tag | Role |
|---|---|
<html> | The root — wraps the whole page |
<head> | Information about the page (not shown in the page body) |
<title> | The page title — shown on the browser tab |
<body> | Everything the visitor actually sees |
Edit the page below and press Run to see it render live:
- HTML tags are written in angle brackets and usually come in pairs: <p> ... </p>.
- The four skeleton tags are <html>, <head>, <title> and <body>.
- The <title> (inside <head>) shows on the browser tab; the <body> holds the visible content.
2Attributes of the body tag
The <body> tag can take attributes that set page-wide appearance (CBSE 165 syllabus):
| Attribute | Sets |
|---|---|
text | Colour of the normal text |
bgcolor | Background colour of the page |
background | An image file used as the page background |
link | Colour of an unvisited link |
vlink | Colour of a visited link |
alink | Colour of an active link (while being clicked) |
<body text="navy" bgcolor="#eef" link="blue" vlink="purple">
red, navy) or as a hex code (#eef, #0a1628). Modern pages set all of this with CSS instead, but the board still tests these body attributes.- Body attributes set page-wide look: text (text colour), bgcolor (background colour), background (background image).
- link, vlink and alink set the colours of unvisited, visited and active links.
- Colours can be names (navy) or hex codes (#0a1628).
3Breaks, rules, headings & paragraphs
HTML ignores extra spaces and line breaks in your code, so you use tags to structure text:
<br>— a line break (an empty tag, no closing tag).<hr>— a horizontal rule (a dividing line; also empty).<h1>to<h6>— headings, h1 largest, h6 smallest.<p>— a paragraph of text.
<h1>Main Heading</h1> <h2>Sub Heading</h2> <p>A paragraph of text.<br>A new line in the same paragraph.</p> <hr> <p>Below the line.</p>
- <br> gives a line break and <hr> a horizontal rule; both are empty tags (no closing tag).
- There are six headings, <h1> (largest) to <h6> (smallest).
- <p> marks a paragraph; HTML ignores extra spaces/newlines in the source.
4Text styling: b, i, u, font, sup & sub
These tags change how text looks:
| Tag | Effect |
|---|---|
<b> | Bold |
<i> | Italic |
<u> | Underline |
<sup> | Superscript (e.g. x<sup>2</sup> → x²) |
<sub> | Subscript (e.g. H<sub>2</sub>O → H₂O) |
The font tag
The <font> tag (CBSE 165) sets the typeface, size and colour of text with three attributes:
<font face="Arial" size="5" color="red">Big red Arial text</font>
face— the font/typeface name (Arial, Verdana…)size— a number from 1 (smallest) to 7 (largest)color— text colour (name or hex)
Try the formatting tags live:
- <b>, <i> and <u> make text bold, italic and underlined.
- <sup> raises text (x<sup>2</sup>) and <sub> lowers it (H<sub>2</sub>O).
- The <font> tag uses face (typeface), size (1–7) and color attributes.
★ Practical: build a profile page
Using the playgrounds above, create one HTML page that has:
- A proper skeleton with a <title> of your name.
- An <h1> heading and at least two paragraphs with a <br> and an <hr>.
- Your favourite subject shown in bold and a quote in italics.
- A <body> background colour and one line using the <font> tag with a face, size and colour.
Ready for the chapter test?
Answer 5 questions. Score 60% or more to mark this chapter complete.
Start the test →💡 Log in to save your progress and earn the certificate.