Current Affairs updated daily
KalviGavaniKalviGavani
Class 11 · Tamil Nadu State Board

HTML Formatting Text Creating Tables List and Links Exercise Solutions | KalviGavani

TN Class 11 Computer Applications HTML Formatting Text, Creating Tables, List and Links exercise solutions — text formatting tags, tables, ordered and unordered lists, hyperlinks, and anchor tags with detailed answers.

Updated 16 June 202616 min read

HTML Formatting Text, Creating Tables, List and Links: Exercise Solutions

How to Use This Page

Read the Samacheer Kalvi textbook chapter first. Then use this page to revise: attempt the textbook questions on your own, then compare with the model answers below. Pay special attention to the Common Mistakes section and the Exam Checklist before your test.

Key Concepts (Quick Recap)

TermDefinition
Bold<b> or <strong> — makes text bold
Italic<i> or <em> — makes text italic
Underline<u> — underlines text
Strikethrough<s> or <strike> — draws a line through text
Superscript<sup> — raises text above the baseline (e.g., x<sup>2</sup>)
Subscript<sub> — lowers text below the baseline (e.g., H<sub>2</sub>O)
Table<table> — creates a table to organise data in rows and columns
Table Row<tr> — defines a row in a table
Table Header<th> — defines a header cell (bold and centered by default)
Table Data<td> — defines a data cell in a table
Ordered List<ol> — creates a numbered/lettered list
Unordered List<ul> — creates a bulleted list
List Item<li> — defines each item in a list
Definition List<dl> — creates a list of terms and descriptions
Hyperlink<a> — creates a link to another page or resource
hrefThe attribute of the <a> tag that specifies the URL of the link
targetAttribute of <a> that specifies where to open the linked document (_blank for new tab)
AnchorA link that jumps to a specific location within the same page using id

I. Choose the Correct Answer (MCQ)

Q1. The tag used to make text bold is _________.

(a) <i> (b) <b> ✓ (c) <u> (d) <s>

ExplanationThe <b> tag makes text bold. The <strong> tag also makes text bold and carries semantic meaning indicating importance.

Q2. Which tag is used to create an unordered list?

(a) <ol> (b) <li> (c) <ul> ✓ (d) <dl>

ExplanationThe <ul> tag creates an unordered list that displays items with bullet points. <ol> creates an ordered (numbered) list, <li> defines individual list items, and <dl> creates a definition list.

Q3. In an HTML table, a row is defined by the tag _________.

(a) <td> (b) <th> (c) <tr> ✓ (d) <table>

ExplanationThe <tr> (table row) tag defines a row in an HTML table. Each row contains one or more <td> (data) or <th> (header) cells.

Q4. The <a> tag is used to create _________.

(a) A table (b) A list (c) A hyperlink ✓ (d) A paragraph

ExplanationThe <a> (anchor) tag creates hyperlinks that link to other web pages, files, email addresses, or locations within the same page. The href attribute specifies the destination URL.

Q5. Which attribute specifies the URL of a hyperlink?

(a) src (b) href ✓ (c) link (d) url

ExplanationThe href attribute of the <a> tag specifies the destination URL. Example: <a href="https://www.example.com">Visit</a>.

Q6. The <sup> tag is used for _________.

(a) Subscript text (b) Superscript text ✓ (c) Strikethrough text (d) Bold text

ExplanationThe <sup> tag displays text as superscript — raised above the normal line and smaller. It is commonly used for mathematical exponents (x<sup>2</sup>) and ordinal indicators (1<sup>st</sup>).

Q7. The default bullet style of an unordered list is _________.

(a) Number (b) Square (c) Disc ✓ (d) Roman numeral

ExplanationThe default bullet style for an unordered list (<ul>) is a filled disc (solid circle). This can be changed using the type attribute: disc, circle, or square.

Q8. The <th> tag is used to create _________.

(a) A table row (b) A table header cell ✓ (c) A table data cell (d) A table caption

ExplanationThe <th> tag defines a header cell in a table. Header cells are bold and centered by default. They are used for column or row headings.

Q9. To open a link in a new browser tab, the target attribute value is _________.

(a) _self (b) _parent (c) _top (d) _blank ✓

ExplanationThe target="_blank" attribute value opens the linked document in a new browser tab or window. _self opens in the same tab (default), _parent opens in the parent frame, and _top opens in the full browser window.

Q10. Which tag is used to create a subscript?

(a) <sup> (b) <sub> ✓ (c) <s> (d) <small>

ExplanationThe <sub> tag displays text as subscript — lowered below the normal line and smaller. It is commonly used in chemical formulas (H<sub>2</sub>O) and mathematical notation.

II. Very Short Answer Questions (2 Marks)

Q1. What are text formatting tags in HTML?

AnswerText formatting tags in HTML change the appearance of text. They include:
  • <b> or <strong> — Bold text
  • <i> or <em> — Italic text
  • <u> — Underlined text
  • <s> — Strikethrough text
  • <sup> — Superscript text
  • <sub> — Subscript text
  • <big> — Larger text
  • <small> — Smaller text
  • <mark> — Highlighted text

These tags are container tags and must be properly closed.

Q2. What is the difference between <b> and <strong>?

Answer
  • <b>: Makes text visually bold but does not convey any special importance. It is a presentational tag.
  • <strong>: Makes text bold AND semantically indicates that the text is important. Screen readers emphasise <strong> text, making it accessible.

Both produce bold text visually, but <strong> is preferred for accessibility and semantic correctness.

Q3. What is a hyperlink?

AnswerA hyperlink (or simply "link") is a reference that a user can click to navigate to another web page, a different section of the same page, a file, or an email address. Hyperlinks are created using the <a> (anchor) tag with the href attribute.

Example: <a href="https://www.example.com">Click here</a>

The text "Click here" is the visible part (called anchor text), and the URL is the destination.

Q4. What is an ordered list?

AnswerAn ordered list is a list of items where the order matters. Items are displayed with numbers (1, 2, 3...) or other sequential markers (letters, Roman numerals). It is created using the <ol> tag, with each item enclosed in <li> tags.

Example:

<ol>
  <li>First item</li>
  <li>Second item</li>
  <li>Third item</li>
</ol>

The type attribute can change the numbering: type="A" (A, B, C), type="a" (a, b, c), type="I" (I, II, III), type="i" (i, ii, iii).

Q5. What is the use of the colspan attribute?

AnswerThe colspan attribute is used in a table cell (<td> or <th>) to merge multiple columns into a single cell. The value specifies the number of columns to span.

Example: <td colspan="3">Merged Cell</td> — this cell spans across 3 columns.

This is useful for creating header rows that span across the full width of a table or for grouping columns under a common heading.

Q6. What is an anchor link?

AnswerAn anchor link (also called an internal link or bookmark) allows users to jump to a specific location within the same web page. It uses the id attribute to mark the destination and the <a> tag with href="#id" to create the link.

Example:

<a href="#section1">Go to Section 1</a>
...
<h2 id="section1">Section 1</h2>

When the user clicks "Go to Section 1," the browser scrolls to the element with id="section1".

III. Short Answer Questions (3 Marks)

Q1. Explain the text formatting tags in HTML with examples.

AnswerHTML provides several tags to format the appearance of text:

1. Bold: <b>...</b> or <strong>...</strong>

   <b>This text is bold</b>
   <strong>This text is important and bold</strong>

2. Italic: <i>...</i> or <em>...</em>

   <i>This text is italic</i>
   <em>This text is emphasised</em>

3. Underline: <u>...</u>

   <u>This text is underlined</u>

4. Strikethrough: <s>...</s> or <strike>...</strike>

   <s>This text has a line through it</s>

5. Superscript: <sup>...</sup> — raises text above the baseline

   E = mc<sup>2</sup>

6. Subscript: <sub>...</sub> — lowers text below the baseline

   H<sub>2</sub>O

7. Big and Small: <big>...</big> and <small>...</small>

   <big>Larger text</big> and <small>Smaller text</small>

8. Highlight: <mark>...</mark> — highlights text with a yellow background

   <mark>This text is highlighted</mark>

All formatting tags are container tags and must be closed with the corresponding </tag>.

Q2. Explain how to create a table in HTML with an example.

AnswerAn HTML table is created using the <table> tag. The structure involves:
  • <table> — The container for the entire table
  • <tr> — Defines a table row
  • <th> — Defines a header cell (bold and centered by default)
  • <td> — Defines a data cell

Example: A table showing student marks:

<table border="1">
  <tr>
    <th>Name</th>
    <th>Maths</th>
    <th>Science</th>
    <th>Total</th>
  </tr>
  <tr>
    <td>Arun</td>
    <td>95</td>
    <td>88</td>
    <td>183</td>
  </tr>
  <tr>
    <td>Bharathi</td>
    <td>90</td>
    <td>92</td>
    <td>182</td>
  </tr>
  <tr>
    <td>Chitra</td>
    <td>85</td>
    <td>95</td>
    <td>180</td>
  </tr>
</table>

Important attributes:

  • border="1" — Adds a border to the table
  • cellpadding — Sets the space between cell content and the cell border
  • cellspacing — Sets the space between cells
  • width — Sets the table width
  • bgcolor — Sets the background colour

Q3. Explain ordered and unordered lists with examples.

Answer

Ordered List (<ol>): An ordered list displays items with sequential numbers or markers, indicating that the order matters.

<ol>
  <li>Wake up early</li>
  <li>Brush your teeth</li>
  <li>Take a bath</li>
  <li>Have breakfast</li>
</ol>

Output: Items appear numbered (1, 2, 3, 4).

The type attribute changes the numbering style:

  • type="1" — Default (1, 2, 3)
  • type="A" — Uppercase letters (A, B, C)
  • type="a" — Lowercase letters (a, b, c)
  • type="I" — Uppercase Roman numerals (I, II, III)
  • type="i" — Lowercase Roman numerals (i, ii, iii)

The start attribute changes the starting number: <ol start="5">.

Unordered List (<ul>): An unordered list displays items with bullet points, indicating no particular order.

<ul>
  <li>Apple</li>
  <li>Banana</li>
  <li>Cherry</li>
</ul>

Output: Items appear with bullet points (filled circles by default).

The type attribute changes the bullet style:

  • type="disc" — Default (filled circle)
  • type="circle" — Hollow circle
  • type="square" — Filled square

Both lists use <li> (list item) tags for each item.

Q4. Explain the different types of hyperlinks with examples.

AnswerHyperlinks can be classified into three types:

1. External Link: Links to a different website.

   <a href="https://www.google.com">Visit Google</a>

This takes the user to an external website.

2. Internal Link (Anchor Link): Links to a specific location within the same page.

   <a href="#chapter3">Go to Chapter 3</a>
   ...
   <h2 id="chapter3">Chapter 3</h2>

This scrolls to the element with id="chapter3" on the same page.

3. Email Link: Opens the default email client with a pre-filled address.

   <a href="mailto:[email protected]">Send Email</a>

Clicking this link opens the email application with the recipient's address filled in.

Target attribute: Controls where the linked document opens:

  • target="_self" — Opens in the same tab (default)
  • target="_blank" — Opens in a new tab or window
  • target="_parent" — Opens in the parent frame
  • target="_top" — Opens in the full browser window

Example with target: <a href="https://www.example.com" target="_blank">Open in new tab</a>

Q5. Explain the rowspan and colspan attributes with examples.

AnswerThe rowspan and colspan attributes merge cells in an HTML table.

colspan (Column Span): Merges two or more columns into a single cell.

<table border="1">
  <tr>
    <th colspan="3">Student Marks</th>
  </tr>
  <tr>
    <th>Name</th>
    <th>Maths</th>
    <th>Science</th>
  </tr>
  <tr>
    <td>Arun</td>
    <td>95</td>
    <td>88</td>
  </tr>
</table>

Here, "Student Marks" spans across all 3 columns.

rowspan (Row Span): Merges two or more rows into a single cell.

<table border="1">
  <tr>
    <td rowspan="2">Arun</td>
    <td>95</td>
  </tr>
  <tr>
    <td>88</td>
  </tr>
</table>

Here, "Arun" spans across 2 rows — the name appears once while two marks are listed beside it.

Key points:

  • colspan="3" means the cell takes up 3 column widths.
  • rowspan="2" means the cell takes up 2 row heights.
  • When using these attributes, reduce the number of <td> tags in the affected rows accordingly.

IV. Long Answer Questions (5 Marks)

Q1. Create an HTML web page demonstrating all text formatting tags with proper examples.

Answer
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>HTML Text Formatting Demo</title>
  </head>
  <body>
    <h1>HTML Text Formatting Tags</h1>
    <hr>

    <h2>Bold and Strong</h2>
    <p><b>This text is bold using the b tag.</b></p>
    <p><strong>This text is strong (bold with semantic importance).</strong></p>

    <h2>Italic and Emphasis</h2>
    <p><i>This text is italic using the i tag.</i></p>
    <p><em>This text is emphasised (italic with semantic importance).</em></p>

    <h2>Underline and Strikethrough</h2>
    <p><u>This text is underlined.</u></p>
    <p><s>This text has a strikethrough.</s></p>

    <h2>Superscript and Subscript</h2>
    <p>Einstein's equation: E = mc<sup>2</sup></p>
    <p>Water formula: H<sub>2</sub>O</p>
    <p>Carbon dioxide: CO<sub>2</sub></p>

    <h2>Big and Small</h2>
    <p><big>This text is bigger than normal.</big></p>
    <p><small>This text is smaller than normal.</small></p>

    <h2>Highlight (Mark)</h2>
    <p><mark>This text is highlighted.</mark></p>

    <h2>Combined Formatting</h2>
    <p><b><i>This text is bold and italic.</i></b></p>
    <p><strong><u>This text is strong and underlined.</u></strong></p>
    <p><b><sup>Bold superscript</sup></b></p>

    <h2>Comparison Table</h2>
    <table border="1">
      <tr>
        <th>Tag</th>
        <th>Effect</th>
        <th>Example</th>
      </tr>
      <tr>
        <td>&lt;b&gt;</td>
        <td>Bold</td>
        <td><b>Bold text</b></td>
      </tr>
      <tr>
        <td>&lt;i&gt;</td>
        <td>Italic</td>
        <td><i>Italic text</i></td>
      </tr>
      <tr>
        <td>&lt;u&gt;</td>
        <td>Underline</td>
        <td><u>Underlined text</u></td>
      </tr>
      <tr>
        <td>&lt;s&gt;</td>
        <td>Strikethrough</td>
        <td><s>Strikethrough text</s></td>
      </tr>
      <tr>
        <td>&lt;sup&gt;</td>
        <td>Superscript</td>
        <td>x<sup>2</sup></td>
      </tr>
      <tr>
        <td>&lt;sub&gt;</td>
        <td>Subscript</td>
        <td>H<sub>2</sub>O</td>
      </tr>
    </table>
  </body>
</html>

Q2. Create an HTML web page with a table, ordered list, unordered list, and hyperlinks.

Answer
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>My School Website</title>
  </head>
  <body>
    <h1>ABC Higher Secondary School</h1>
    <hr>

    <!-- Hyperlinks -->
    <h2>Useful Links</h2>
    <p><a href="https://www.tn.gov.in" target="_blank">Tamil Nadu Government</a></p>
    <p><a href="https://www.tnschools.gov.in" target="_blank">TN Schools Portal</a></p>
    <p><a href="mailto:[email protected]">Contact Us by Email</a></p>
    <p><a href="#subjects">Jump to Subjects</a></p>
    <hr>

    <!-- Table -->
    <h2>Student Marks - Class 11</h2>
    <table border="1" cellpadding="5" cellspacing="0">
      <tr>
        <th colspan="4">Quarterly Examination Results</th>
      </tr>
      <tr>
        <th>Roll No</th>
        <th>Name</th>
        <th>Maths</th>
        <th>Science</th>
      </tr>
      <tr>
        <td>101</td>
        <td>Arun</td>
        <td>95</td>
        <td>88</td>
      </tr>
      <tr>
        <td>102</td>
        <td>Bharathi</td>
        <td>90</td>
        <td>92</td>
      </tr>
      <tr>
        <td>103</td>
        <td>Chitra</td>
        <td>85</td>
        <td>95</td>
      </tr>
    </table>
    <hr>

    <!-- Ordered List -->
    <h2 id="subjects">Subjects - In Order of Exam Schedule</h2>
    <ol type="1">
      <li>Tamil</li>
      <li>English</li>
      <li>Mathematics</li>
      <li>Physics</li>
      <li>Chemistry</li>
      <li>Computer Applications</li>
    </ol>
    <hr>

    <!-- Unordered List -->
    <h2>Extra-Curricular Activities</h2>
    <ul type="disc">
      <li>Cricket</li>
      <li>Volleyball</li>
      <li>Music</li>
      <li>Dance</li>
      <li>Art</li>
      <li>Science Club</li>
    </ul>
    <hr>

    <!-- Definition List -->
    <h2>Key Terms</h2>
    <dl>
      <dt>HTML</dt>
      <dd>HyperText Markup Language - used to create web pages</dd>
      <dt>CSS</dt>
      <dd>Cascading Style Sheets - used to style web pages</dd>
    </dl>

    <hr>
    <p><a href="#top">Back to Top</a></p>
  </body>
</html>

Q3. Explain lists in HTML — ordered, unordered, and definition lists — with examples and attributes.

AnswerHTML provides three types of lists:

1. Ordered List (<ol>): An ordered list displays items in a specific sequence using numbers, letters, or Roman numerals.

<ol type="A">
  <li>Chapter 1: Introduction</li>
  <li>Chapter 2: HTML Basics</li>
  <li>Chapter 3: Formatting</li>
</ol>

Output: A. Chapter 1, B. Chapter 2, C. Chapter 3

Attributes:

  • type="1" — Arabic numerals (1, 2, 3) — default
  • type="A" — Uppercase letters (A, B, C)
  • type="a" — Lowercase letters (a, b, c)
  • type="I" — Uppercase Roman (I, II, III)
  • type="i" — Lowercase Roman (i, ii, iii)
  • start="5" — Starts numbering from 5
  • reversed — Reverses the order (HTML5)

2. Unordered List (<ul>): An unordered list displays items with bullet points, indicating no particular order.

<ul type="square">
  <li>Cricket</li>
  <li>Football</li>
  <li>Basketball</li>
</ul>

Output: Items with square bullet points.

Attributes:

  • type="disc" — Filled circle (default)
  • type="circle" — Hollow circle
  • type="square" — Filled square

3. Definition List (<dl>): A definition list pairs terms with their descriptions.

<dl>
  <dt>HTML</dt>
  <dd>HyperText Markup Language, used to create web pages</dd>
  <dt>CSS</dt>
  <dd>Cascading Style Sheets, used to style web pages</dd>
  <dt>JavaScript</dt>
  <dd>A programming language for web interactivity</dd>
</dl>

Output:

HyperText Markup Language, used to create web pages

Cascading Style Sheets, used to style web pages

A programming language for web interactivity

  • HTML
  • CSS
  • JavaScript

Tags: <dl> (definition list), <dt> (definition term), <dd> (definition description).

Nested Lists: Lists can be nested inside each other:

<ol>
  <li>Fruits
    <ul>
      <li>Apple</li>
      <li>Mango</li>
    </ul>
  </li>
  <li>Vegetables
    <ul>
      <li>Carrot</li>
      <li>Potato</li>
    </ul>
  </li>
</ol>

Common Mistakes to Avoid

  • Forgetting to close list tags — <li> items must be closed with </li>, and <ol>, <ul>, <dl> must be closed.
  • Confusing <ol> (ordered/numbered list) with <ul> (unordered/bulleted list).
  • Missing the border attribute in <table> — without border="1", the table lines are invisible in most browsers.
  • Forgetting <tr> tags — table data must be inside rows, not directly inside <table>.
  • Mixing up <th> and <td> — use <th> for headers (bold, centered) and <td> for data cells.
  • Writing href as src in anchor tags — <a> uses href, while <img> uses src.
  • Not using # before an anchor link ID — internal links must use href="#sectionID".
  • Forgetting the target="_blank" attribute when you want a link to open in a new tab.
  • Confusing colspan (merge columns) with rowspan (merge rows).
  • Using <b> for important text instead of <strong> — <strong> is semantically correct for emphasis.

Exam Checklist

  • [ ] Can use all text formatting tags: <b>, <i>, <u>, <s>, <sup>, <sub>, <mark>, <big>, <small>
  • [ ] Know the difference between <b> and <strong>, <i> and <em>
  • [ ] Can create a table with <table>, <tr>, <th>, <td>
  • [ ] Can use table attributes: border, cellpadding, cellspacing, width, bgcolor
  • [ ] Can use colspan and rowspan to merge table cells
  • [ ] Can create ordered lists with different type attributes (1, A, a, I, i)
  • [ ] Can create unordered lists with different bullet styles (disc, circle, square)
  • [ ] Can create definition lists with <dl>, <dt>, <dd>
  • [ ] Can create hyperlinks with <a href=""> and know the target attribute values
  • [ ] Can create anchor links within a page using id
  • [ ] Can create email links using mailto:
  • [ ] Can nest lists within other lists

Frequently Asked Questions

HTML provides tags to format text appearance: <b> or <strong> for bold, <i> or <em> for italic, <u> for underline, <s> for strikethrough, <sup> for superscript, <sub> for subscript, <big> for larger text, <small> for smaller text, and <mark> for highlighted text.
← Browse all Class 11 Exercise Solutions

More exercise solutions

Exercise Solutions

Introduction to Computers Exercise Solutions | KalviGavani

Exercise Solutions

HTML Structural Tags Exercise Solutions | KalviGavani

Exercise Solutions

HTML Adding Multimedia Elements and Forms Exercise Solutions | KalviGavani