Class 10 HTML-I Ch. 3 Practical Assignment Solutions

By /
Class 10 Computer Applications – Ch 3 HTML-I Practical Assignment Solutions

Class 10 HTML-I Ch. 3 Practical Assignment – Solutions

📘 Subject: Computer Applications
📚 Chapter: 3 – HTML-I
🎓 Class: 10 (CBSE Board)
✍️ Prepared by: MasterG

Q1. Text inside paragraphs is displayed.

HTML Code:

<HTML>
<BODY>
<P>
This paragraph contains a lot of lines in the source code, but the browser ignores it.
</P>

<P>
This paragraph contains a lot of spaces in the source code, but the browser ignores it.
</P>

<P>
The number of lines in a paragraph depends on the size of your browser window.
If you resize the browser window, the number of lines in this paragraph will change.
</P>
</BODY>
</HTML>

Answer / Output:

This paragraph contains a lot of lines in the source code, but the browser ignores it.

This paragraph contains a lot of spaces in the source code, but the browser ignores it.

The number of lines in a paragraph depends on the size of your browser window. If you resize the browser window, the number of lines in this paragraph will change.

Explanation: Extra spaces and line breaks in the source code are ignored inside <p>. The browser automatically wraps text based on window size.

Q2. Use of break <BR> tag

HTML Code:

<HTML>
<BODY>
<P>
To break<BR>lines<BR>in a<BR>paragraph<BR>use the BR tag.
</P>
</BODY>
</HTML>

Answer / Output:

To break
lines
in a
paragraph
use the BR tag.

Explanation: Each <br> forces the following text onto a new line, unlike <p> which adds spacing.

Class 10 Computer Applications – Ch 3 HTML-I Practical Assignment Solutions

🖥️ Class 10 Computer Applications – HTML-I (Practical Assignment Solutions)

Prepared by MasterG • CBSE Class 10 • Chapter 3 – HTML-I

Each problem shows: the original HTML code ➜ the rendered output ➜ a brief explanation.

Q1. Text inside paragraphs is displayed.

HTML Code

<HTML>
<BODY>
<P>
This paragraph contains a lot of lines in the source code, but the browser ignores it.
</P>

<P>
This paragraph contains a lot of spaces in the source code, but the browser ignores it.
</P>

<P>
The number of lines in a paragraph depends on the size of your browser window.
If you resize the browser window, the number of lines in this paragraph will change.
</P>
</BODY>
</HTML>

Answer / Output

This paragraph contains a lot of lines in the source code, but the browser ignores it.

This paragraph contains a lot of spaces in the source code, but the browser ignores it.

The number of lines in a paragraph depends on the size of your browser window. If you resize the browser window, the number of lines in this paragraph will change.

Explanation: Inside <p>, the browser collapses extra spaces and newlines into a single space and wraps text based on window width.

Q2. Use of break <BR> tag

HTML Code

<HTML>
<BODY>
<P>
To break<BR>lines<BR>in a<BR>paragraph<BR>use the BR tag.
</P>
</BODY>
</HTML>

Answer / Output

To break
lines
in a
paragraph
use the BR tag.

Explanation: Each <br> inserts a line break without extra spacing.

Q3. HTML editor ignores your formatting

HTML Code

<HTML>
<BODY>
<P>
My Bonnie lies over the ocean.
My Bonnie lies over the sea.
My Bonnie lies over the ocean.
Oh, bring back my Bonnie to me.
</P>

<P>Note that your browser simply ignores your formatting!</P>
</BODY>
</HTML>

Answer / Output

My Bonnie lies over the ocean. My Bonnie lies over the sea. My Bonnie lies over the ocean. Oh, bring back my Bonnie to me.

Note that your browser simply ignores your formatting!

Explanation: In normal flow, HTML collapses consecutive spaces/newlines. Use <br> or CSS/whitespace-preserving tags to keep manual line breaks.

Q4. The Heading Tags

HTML Code

<HTML> <BODY>
<H1>This is heading 1</H1>
<H2>This is heading 2</H2>
<H3>This is heading 3</H3>
<H4>This is heading 4</H4>
<H5>This is heading 5</H5>
<H6>This is heading 6</H6>

<P>Use the heading tags only for headings. Don’t use them to make something big. Use other tags for that.</P>
</BODY> </HTML>

Answer / Output

This is heading 1
This is heading 2
This is heading 3
This is heading 4
This is heading 5
This is heading 6

Use the heading tags only for headings. Don’t use them to make something big. Use other tags for that.

Explanation: H1…H6 are semantic headings that render from largest to smallest by default.

Q5. Centralized Heading

HTML Code

<HTML>
<BODY>
<H1 align="center">This is heading 1</H1>
<P>The heading above is aligned to the center of this page. The heading above is aligned to the center of this page. The heading above is aligned to the center of this page.</P>
</BODY>
</HTML>

Answer / Output

This is heading 1

The heading above is aligned to the center of this page. The heading above is aligned to the center of this page. The heading above is aligned to the center of this page.

Explanation: The legacy align="center" attribute centers the heading. (Modern HTML prefers CSS: text-align:center.)

Q6. Defining and Using a Horizontal Rule

HTML Code

<HTML> <BODY>
<P>The hr tag defines a horizontal rule:</P>
<HR>
<P>This is a paragraph</P>
<HR>
<P>This is a paragraph</P>
<HR>
<P>This is a paragraph</P>
</BODY> </HTML>

Answer / Output

The hr tag defines a horizontal rule:

This is a paragraph

This is a paragraph

This is a paragraph

Explanation: <hr> draws a horizontal line separating blocks.

Q7. Comments in HTML Source

HTML Code

<HTML> <BODY>
<!--This comment will not be displayed-->
<P>This is a regular paragraph</P>
</BODY> </HTML>

Answer / Output

This is a regular paragraph

Explanation: Content inside <!-- ... --> is a comment — it doesn’t render in the page.

Q8. Add a Background Colour

HTML Code

<HTML> <BODY bgcolor="yellow">
<H3>Look: Colored Background!</H3>
</BODY> </HTML>

Answer / Output

Look: Colored Background!
Explanation: The (deprecated) bgcolor attribute paints the page background. Modern HTML uses CSS: background-color: yellow.

Q9. Add a Background Image

HTML Code

<HTML> <BODY background="background.jpg">
<H3>Look: Image Background!</H3>
<P>Both gif and jpg files can be used as HTML backgrounds.</P>
<P>If the image is smaller than the page, the image will repeat itself.</P>
</BODY> </HTML>

Answer / Output

Look: Image Background!

Both gif and jpg files can be used as HTML backgrounds.

If the image is smaller than the page, the image will repeat itself.

Explanation: The legacy background attribute tiles the image. Today we use CSS: background-image and related properties.

Q10. Text Formatting

HTML Code

<HTML> <BODY>
<B>This text is bold</B><BR>
<STRONG>This text is strong</STRONG><BR>
<BIG>This text is big</BIG><BR>
<EM>This text is emphasized</EM><BR>
<I>This text is italic</I><BR>
<SMALL>This text is small</SMALL><BR>
This text contains <SUB>subscript</SUB><BR>
This text contains <SUP>superscript</SUP>
</BODY> </HTML>

Answer / Output

This text is bold
This text is strong
This text is big
This text is emphasized
This text is italic
This text is small
This text contains subscript
This text contains superscript
Explanation: The various inline tags alter weight, style, or size; <sub>/<sup> shift baseline.

Q11. Title Bar Text

HTML Code

<HTML>
<HEAD><TITLE>Computer Education</TITLE></HEAD>
<BODY><P>Check the title bar above.</P></BODY>
</HTML>

Answer / Output

(The browser tab/title would show: Computer Education)

Check the title bar above.

Explanation: The <title> element (inside <head>) sets the document’s tab/title, not page body text.

Q12. Background Colour Grey & Text Colour Red

HTML Code

<HTML> <BODY bgcolor="grey" text="red">
<P>This text will appear in red on a grey background.</P>
</BODY> </HTML>

Answer / Output

This text will appear in red on a grey background.
Explanation: Legacy bgcolor/text attributes set page colors. CSS is preferred: background-color / color.

Q13. Heading in H1 (Times New Roman, Red, Center)

HTML Code

<HTML> <BODY>
<H1 align="center">
<FONT face="Times New Roman" color="red">
My First Web Page
</FONT>
</H1>
</BODY> </HTML>

Answer / Output

My First Web Page
Explanation: align centers the heading; font face/color (deprecated) request family & color.

Q14. Paragraph with alignment & font settings

HTML Code

<HTML> <BODY>
<P align="right">
<FONT face="Comic Sans MS" color="blue" size="4">
Today, one of the major reasons businesses, homes and other users purchase computers 
is to gain Internet access. Many companies and organizations assume that the public is 
familiar with the Internet. Web addresses appear on television, in radio broadcasts, in 
printed newspapers, magazines and in other forms of advertising. Software companies use 
their Web sites as a place for you to download upgrades or enhancements to software products. 
To be successful today, you must have an understanding of the Internet. Without it, you are 
missing a tremendous resource for goods, services and information.
</FONT>
</P>
</BODY> </HTML>

Answer / Output

Today, one of the major reasons businesses, homes and other users purchase computers is to gain Internet access. Many companies and organizations assume that the public is familiar with the Internet. Web addresses appear on television, in radio broadcasts, in printed newspapers, magazines and in other forms of advertising. Software companies use their Web sites as a place for you to download upgrades or enhancements to software products. To be successful today, you must have an understanding of the Internet. Without it, you are missing a tremendous resource for goods, services and information.
Explanation: align="right" right-aligns the paragraph; font tag requests Comic Sans, blue, and size.

Q15. Paragraph with <B>, <I>, <U>

HTML Code

<HTML> <BODY>
<P>
<B>Today, one of the major reasons businesses</B>, 
<I>homes and other users purchase computers</I> 
<U>is to gain Internet access.</U>
</P>

<P>
<B>Many companies and organizations</B> 
<I>assume that the public is familiar with the Internet.</I> 
<U>Web addresses appear everywhere.</U>
</P>
</BODY> </HTML>

Answer / Output

Today, one of the major reasons businesses, homes and other users purchase computers is to gain Internet access.

Many companies and organizations assume that the public is familiar with the Internet. Web addresses appear everywhere.

Explanation: Inline formatting tags apply to only the wrapped words, leaving the rest normal.

Q16. Heading (H3) with left alignment, red, Comic Sans

HTML Code

<HTML> <BODY>
<H3 align="left">
<FONT color="red" face="Comic Sans MS">
Exiting Features Offered By HTML
</FONT>
</H3>
</BODY> </HTML>

Answer / Output

Exiting Features Offered By HTML
Explanation: The heading renders small (H3), left-aligned, in red Comic Sans.

Q17. Font style size = 5 applied to a list

HTML Code

<HTML> <BODY>
<FONT face="Arial" size="5" color="blue">
<UL>
<LI>E-Mail</LI>
<LI>Information</LI>
<LI>Discussion Groups</LI>
<LI>Online Shopping</LI>
<LI>Entertainment</LI>
<LI>Programme</LI>
</UL>
</FONT>
</BODY> </HTML>

Answer / Output

  • E-Mail
  • Information
  • Discussion Groups
  • Online Shopping
  • Entertainment
  • Programme
Explanation: The <font> tag upsizes and colors all enclosed list items.

Q18. Horizontal rule at 50% width

HTML Code

<!DOCTYPE html>
<html><body>
<p>Horizontal rule at 50% width:</p>
<hr width="50%">
</body></html>

Answer / Output

Horizontal rule at 50% width:

Explanation: The width attribute restricts the rule to half the container; browsers center it by default.

Q19. Combine <b>, <i>, <u>, <tt>

HTML Code

<!DOCTYPE html><html><body>
<p>
<b>Bold</b> | <i>Italic</i> | <u>Underlined</u> | <tt>Typewriter (monospace)</tt>
</p>
<p><b><i><u><tt>All effects combined together</tt></u></i></b></p>
</body></html>

Answer / Output

Bold | Italic | Underlined | Typewriter (monospace)

All effects combined together

Explanation: Inline tags can be stacked; the final style is the combination of all applied tags.

Q20. Save with “.HTML” extension (instruction)

HTML Code

(No code – procedural step)

Answer / Output

Use File → Save in your editor and name the file like exercise.html.
Explanation: Files ending in .html/.htm are recognized by browsers as web pages.

Q21. Types of ordered lists

HTML Code

<!DOCTYPE html><html><body>
<h4>Numbered list:</h4>
<ol><li>Apples</li><li>Bananas</li></ol>

<h4>Uppercase letters list:</h4>
<ol type="A"><li>Apples</li><li>Bananas</li><li>Lemons</li><li>Oranges</li></ol>

<h4>Lowercase letters list:</h4>
<ol type="a"><li>Apples</li><li>Bananas</li></ol>

<h4>Uppercase Roman numbers list:</h4>
<ol type="I"><li>Apples</li><li>Bananas</li></ol>

<h4>Lowercase Roman numbers list:</h4>
<ol type="i"><li>Apples</li><li>Bananas</li></ol>
</body></html>

Answer / Output

Numbered list:

  1. Apples
  2. Bananas

Uppercase letters list:

  1. Apples
  2. Bananas
  3. Lemons
  4. Oranges

Lowercase letters list:

  1. Apples
  2. Bananas

Uppercase Roman numbers list:

  1. Apples
  2. Bananas

Lowercase Roman numbers list:

  1. Apples
  2. Bananas
Explanation: The type attribute switches numbering style: 1, A, a, I, i.

Q22. Types of unordered lists

HTML Code

<!DOCTYPE html><html><body>
<h4>Disc bullets list:</h4>
<ul type="disc"><li>Apples</li><li>Bananas</li></ul>

<h4>Circle bullets list:</h4>
<ul type="circle"><li>Apples</li><li>Bananas</li></ul>

<h4>Square bullets list:</h4>
<ul type="square"><li>Apples</li><li>Bananas</li></ul>
</body></html>

Answer / Output

Disc bullets list:

  • Apples
  • Bananas

Circle bullets list:

  • Apples
  • Bananas

Square bullets list:

  • Apples
  • Bananas
Explanation: Unordered lists can use disc (solid), circle (hollow), or square bullets.

Q23. Nested list

HTML Code

<!DOCTYPE html><html><body>
<h4>A nested list:</h4>
<ul>
  <li>Coffee</li>
  <li>Tea
    <ul>
      <li>Black tea</li>
      <li>Green tea</li>
    </ul>
  </li>
  <li>Juice</li>
  <li>Milk</li>
</ul>
</body></html>

Answer / Output

A nested list:

  • Coffee
  • Tea
    • Black tea
    • Green tea
  • Juice
  • Milk
Explanation: Lists can be nested; the inner list becomes a sub-list of its parent item.

Q24. Definition list

HTML Code

<!DOCTYPE html><html><body>
<h4>A Definition List:</h4>
<dl>
  <dt>Coffee</dt>
  <dd>Black hot drink</dd>
  <dt>Milk</dt>
  <dd>White cold drink</dd>
</dl>
</body></html>

Answer / Output

A Definition List:

Coffee
Black hot drink
Milk
White cold drink
Explanation: <dl> pairs a term (<dt>) with one or more definitions (<dd>).

Q25. Wrap etiquette points in a <ul> list

HTML Code

<!DOCTYPE html><html><body>
<h4>Basic etiquette for gentlemen for greeting a lady.</h4>
<ul>
  <li>Wait for her acknowledging bow before starting conversation.</li>
  <li>Walk with her if she expresses a wish to converse.</li>
  <li>When walking, the lady must always have the wall.</li>
  <li>Never make a lady stand talking in the street.</li>
  <li>On outing in a restaurant, first offer her a seat and then take your seat.</li>
</ul>
</body></html>

Answer / Output

Basic etiquette for gentlemen for greeting a lady.

  • Wait for her acknowledging bow before starting conversation.
  • Walk with her if she expresses a wish to converse.
  • When walking, the lady must always have the wall.
  • Never make a lady stand talking in the street.
  • On outing in a restaurant, first offer her a seat and then take your seat.
Explanation: The unordered list presents each etiquette point as a bullet for readability.

Q26. Insert <ol> around list text (Roman numerals)

HTML Code

<!DOCTYPE html><html><body>
<ol type="I">
  <li>Recourse for a lady toward unpleasant men who persist in bowing.</li>
  <li>A simple stare of iciness should suffice in most instances.</li>
  <li>Her ignorance is sufficient that she is not willing to be friendly.</li>
  <li>As a last resort: "Sir, I have not the honor of your acquaintance."</li>
</ol>
</body></html>

Answer / Output

  1. Recourse for a lady toward unpleasant men who persist in bowing.
  2. A simple stare of iciness should suffice in most instances.
  3. Her ignorance is sufficient that she is not willing to be friendly.
  4. As a last resort: "Sir, I have not the honor of your acquaintance."
Explanation: type="I" uses uppercase Roman numerals.

Q27. Definition list for Royal Address

HTML Code

<!DOCTYPE html><html><body>
<h4>Proper Address Of Royalty:</h4>
<dl>
  <dt>Your Majesty</dt> <dd>To The King or Queen</dd>
  <dt>Your Highness</dt> <dd>To The King’s Children</dd>
  <dt>Your Highness</dt> <dd>To Nephews, Nieces and Cousins of the King</dd>
</dl>
</body></html>

Answer / Output

Proper Address Of Royalty:

Your Majesty
To The King or Queen
Your Highness
To The King’s Children
Your Highness
To Nephews, Nieces and Cousins of the King
Explanation: Each title is a term; the meaning is its definition directly beneath.

Q28. Unordered list with different bullet styles

HTML Code

<!DOCTYPE html><html><body>
<ul type="disc"><li>Car</li><li>Scooter</li><li>Van</li></ul>
<ul type="circle"><li>Car</li><li>Scooter</li><li>Van</li></ul>
<ul type="square"><li>Car</li><li>Scooter</li><li>Van</li></ul>
</body></html>

Answer / Output

  • Car
  • Scooter
  • Van
  • Car
  • Scooter
  • Van
  • Car
  • Scooter
  • Van
Explanation: type controls bullet shape for <ul>.

Q29. Ordered list with different numbering styles

HTML Code

<!DOCTYPE html><html><body>
<ol type="a"><li>Story Books</li><li>Computer Books</li><li>Text Books</li><li>General Books</li></ol>
<ol type="i"><li>Story Books</li><li>Computer Books</li><li>Text Books</li><li>General Books</li></ol>
<ol type="1"><li>Story Books</li><li>Computer Books</li><li>Text Books</li><li>General Books</li></ol>
</body></html>

Answer / Output

  1. Story Books
  2. Computer Books
  3. Text Books
  4. General Books
  1. Story Books
  2. Computer Books
  3. Text Books
  4. General Books
  1. Story Books
  2. Computer Books
  3. Text Books
  4. General Books
Explanation: a = lowercase letters; i = lowercase Roman; 1 = numbers.

Q30. Create a nested list using <ol> and <ul>

HTML Code

<!DOCTYPE html><html><body>
<ol>
  <li>Operating System
    <ul>
      <li>Disk Operating System</li><li>Windows</li><li>Unix</li><li>Linux</li>
    </ul>
  </li>
  <li>MS-Office
    <ul>
      <li>Word</li><li>Excel</li><li>PowerPoint</li><li>Access</li>
    </ul>
  </li>
  <li>OpenOffice.org
    <ul>
      <li>Writer</li><li>Calc</li><li>Impress</li><li>Base</li>
    </ul>
  </li>
  <li>Accessories
    <ul>
      <li>Paint</li><li>Calculator</li><li>Note Pad</li><li>Word Pad</li>
    </ul>
  </li>
</ol>
</body></html>

Answer / Output

  1. Operating System
    • Disk Operating System
    • Windows
    • Unix
    • Linux
  2. MS-Office
    • Word
    • Excel
    • PowerPoint
    • Access
  3. OpenOffice.org
    • Writer
    • Calc
    • Impress
    • Base
  4. Accessories
    • Paint
    • Calculator
    • Note Pad
    • Word Pad
Explanation: An ordered “category” list with bullet sub-items for each category.

Q31. Apply different font styles on these lists

HTML Code

<!DOCTYPE html><html><body>
<ol>
  <li><b>Bold Item</b></li>
  <li><i>Italic Item</i></li>
  <li><u>Underlined Item</u></li>
  <li><tt>Monospace Item</tt></li>
</ol>
</body></html>

Answer / Output

  1. Bold Item
  2. Italic Item
  3. Underlined Item
  4. Monospace Item
Explanation: Each list item demonstrates a different inline text style.

Q32. Ordered list (uppercase Roman), red background, title “My Subjects”

HTML Code

<!DOCTYPE html>
<html>
<head><title>My Subjects</title></head>
<body style="background-color:red; color:white;">
<h2>My Subjects</h2>
<ol type="I">
  <li>Mathematics</li>
  <li>Science</li>
  <li>Computer Applications</li>
</ol>
</body>
</html>

Answer / Output

My Subjects
  1. Mathematics
  2. Science
  3. Computer Applications
[Tab/Title would show: My Subjects]
Explanation: Page background set to red with white text; list uses uppercase Roman numerals; <title> sets the tab name.

End of Chapter 3 – HTML-I Practical Assignment Solutions.

Class 10 HTML- I Ch. -3 Practical Assignment – Solutions

📥 Download PDF:

👉 Download Full Q&A PDF 

🔔 Stay Connected:

Follow MasterG for more NCERT-based Q&A, mock tests, and video lectures.

Class 10 HTML-I Ch. 3 Practical Assignment – Solutions

Recent Posts
Grade 10 CH. 3 HTML – I Solutions

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top