HTML Symbols – Solved Practice Questions

By /

Introduction

HTML symbols are special characters that can be displayed using HTML entity names or numeric entity codes. Symbols are commonly used for copyright, trademarks, currency, arrows, mathematical operators, card suits, stars, and other special characters. In this chapter, you’ll practice displaying commonly used HTML symbols with simple solved examples.

Question 1

Problem Statement

Display copyright, trademark, and registered symbols.

HTML Code

<!DOCTYPE html>
<html>
<head>
    <title>Common Symbols</title>
</head>
<body>

    <h1>Website Footer</h1>

    <p>&copy; 2026 CodeMantra</p>

    <p>CodeMantra&trade;</p>

    <p>CodeMantra&reg;</p>

</body>
</html>

Output

Website Footer

© 2026 CodeMantra

CodeMantra™

CodeMantra®

Step-by-Step Explanation

  • &copy; displays ©.
  • &trade; displays ™.
  • &reg; displays ®.
  • These symbols are commonly used for brands and copyrights.

Question 2

Problem Statement

Display different currency symbols.

HTML Code

<!DOCTYPE html>
<html>
<head>
    <title>Currency Symbols</title>
</head>
<body>

    <h1>Product Prices</h1>

    <p>Dollar: &dollar;100</p>

    <p>Euro: &euro;90</p>

    <p>Pound: &pound;80</p>

    <p>Rupee: &#8377;500</p>

    <p>Yen: &yen;1000</p>

</body>
</html>

Output

Product Prices

Dollar: $100

Euro: €90

Pound: £80

Rupee: ₹500

Yen: ¥1000

Step-by-Step Explanation

  • HTML entities display different currency symbols.
  • Currency symbols improve readability on shopping and finance websites.

Question 3

Problem Statement

Display mathematical symbols.

HTML Code

<!DOCTYPE html>
<html>
<head>
    <title>Math Symbols</title>
</head>
<body>

    <h1>Math Examples</h1>

    <p>5 &times; 6 = 30</p>

    <p>20 &divide; 4 = 5</p>

    <p>10 &plusmn; 2</p>

    <p>2 &ne; 5</p>

</body>
</html>

Output

Math Examples

5 × 6 = 30

20 ÷ 4 = 5

10 ± 2

2 ≠ 5

Step-by-Step Explanation

  • &times; displays ×.
  • &divide; displays ÷.
  • &plusmn; displays ±.
  • &ne; displays ≠.

Question 4

Problem Statement

Display arrow symbols.

HTML Code

<!DOCTYPE html>
<html>
<head>
    <title>Arrow Symbols</title>
</head>
<body>

    <h1>Directions</h1>

    <p>&larr; Left</p>

    <p>&rarr; Right</p>

    <p>&uarr; Up</p>

    <p>&darr; Down</p>

</body>
</html>

Output

Directions

← Left

→ Right

↑ Up

↓ Down

Step-by-Step Explanation

  • &larr; displays a left arrow.
  • &rarr; displays a right arrow.
  • &uarr; displays an up arrow.
  • &darr; displays a down arrow.

Question 5

Problem Statement

Display star, heart, and music symbols.

HTML Code

<!DOCTYPE html>
<html>
<head>
    <title>Special Symbols</title>
</head>
<body>

    <h1>Favorite Symbols</h1>

    <p>Star: &#9733;</p>

    <p>Heart: &#10084;</p>

    <p>Music: &#9835;</p>

</body>
</html>

Output

Favorite Symbols

Star: ★

Heart: ❤

Music: ♫

Step-by-Step Explanation

  • &#9733; displays ★.
  • &#10084; displays ❤.
  • &#9835; displays ♫.
  • Numeric entities can display many Unicode symbols.

Question 6

Problem Statement

Display playing card suit symbols.

HTML Code

<!DOCTYPE html>
<html>
<head>
    <title>Card Suit Symbols</title>
</head>
<body>

    <h1>Playing Cards</h1>

    <p>Spade: &spades;</p>

    <p>Heart: &hearts;</p>

    <p>Diamond: &diams;</p>

    <p>Club: &clubs;</p>

</body>
</html>

Output

Playing Cards

Spade: ♠

Heart: ♥

Diamond: ♦

Club: ♣

Step-by-Step Explanation

  • &spades; displays ♠.
  • &hearts; displays ♥.
  • &diams; displays ♦.
  • &clubs; displays ♣.

Question 7

Problem Statement

Display check mark and cross symbols.

HTML Code

<!DOCTYPE html>
<html>
<head>
    <title>Check Mark Symbols</title>
</head>
<body>

    <h1>Task Status</h1>

    <p>&#10004; HTML Completed</p>

    <p>&#10008; CSS Pending</p>

</body>
</html>

Output

Task Status

✔ HTML Completed

✘ CSS Pending

Step-by-Step Explanation

  • &#10004; displays a check mark.
  • &#10008; displays a cross mark.
  • These symbols are useful for task lists and status indicators.

Question 8

Problem Statement

Display Greek letters using HTML entities.

HTML Code

<!DOCTYPE html>
<html>
<head>
    <title>Greek Letters</title>
</head>
<body>

    <h1>Greek Symbols</h1>

    <p>Alpha: &alpha;</p>

    <p>Beta: &beta;</p>

    <p>Gamma: &gamma;</p>

    <p>Delta: &delta;</p>

</body>
</html>

Output

Greek Symbols

Alpha: α

Beta: β

Gamma: γ

Delta: δ

Step-by-Step Explanation

  • &alpha; displays α.
  • &beta; displays β.
  • &gamma; displays γ.
  • &delta; displays δ.
  • Greek letters are commonly used in mathematics and science.

Question 9

Problem Statement

Display the degree symbol for temperature.

HTML Code

<!DOCTYPE html>
<html>
<head>
    <title>Degree Symbol</title>
</head>
<body>

    <h1>Today's Weather</h1>

    <p>Temperature: 32&deg;C</p>

    <p>Room Temperature: 24&deg;C</p>

</body>
</html>

Output

Today's Weather

Temperature: 32°C

Room Temperature: 24°C

Step-by-Step Explanation

  • &deg; displays the degree symbol (°).
  • It is commonly used with temperature and angles.

Question 10

Problem Statement

Create a webpage that displays different HTML symbols together.

HTML Code

<!DOCTYPE html>
<html>
<head>
    <title>HTML Symbols Example</title>
</head>
<body>

    <h1>HTML Symbols Demo</h1>

    <p>&copy; 2026 CodeMantra&trade;</p>

    <p>Course Fee: &#8377;2,999</p>

    <p>Temperature: 28&deg;C</p>

    <p>Success: &#10004;</p>

    <p>Direction: &rarr;</p>

    <p>Heart: &hearts;</p>

    <p>Math: 15 &divide; 3 = 5</p>

</body>
</html>

Output

HTML Symbols Demo

© 2026 CodeMantra™

Course Fee: ₹2,999

Temperature: 28°C

Success: ✔

Direction: →

Heart: ♥

Math: 15 ÷ 3 = 5

Step-by-Step Explanation

  • &copy; displays ©.
  • &trade; displays ™.
  • &#8377; displays ₹.
  • &deg; displays °.
  • &#10004; displays ✔.
  • &rarr; displays →.
  • &hearts; displays ♥.
  • &divide; displays ÷.

Key Takeaways

  • HTML symbols are displayed using entity names or numeric entity codes.
  • &copy; displays the copyright symbol.
  • &trade; displays the trademark symbol.
  • &reg; displays the registered trademark symbol.
  • &deg; displays the degree symbol.
  • &times; and &divide; display mathematical symbols.
  • Arrow symbols are useful for navigation and instructions.
  • Currency symbols improve the readability of prices.
  • Numeric entities can display many Unicode symbols.
  • HTML symbols are supported by all modern browsers.

Frequently Asked Questions (FAQs)

1. What are HTML symbols?

HTML symbols are special characters displayed using HTML entity names or numeric entity codes.

2. What is the difference between HTML entities and HTML symbols?

HTML entities are the codes (such as &copy;), while HTML symbols are the characters they display (such as ©).

3. How do you display the copyright symbol?

&copy;

4. How do you display the degree symbol?

&deg;

5. How do you display the Rupee symbol?

&#8377;

6. How do you display arrow symbols?

Use entities like &larr;, &rarr;, &uarr;, and &darr;.

7. Can I use numeric codes instead of entity names?

Yes. HTML supports both entity names and numeric entity codes.

8. Are HTML symbols supported in all browsers?

Yes. Standard HTML symbols are supported by all modern browsers.

9. Can I display emojis using HTML?

Yes. Emojis can be displayed using Unicode numeric entities.

10. Where are HTML symbols commonly used?

They are commonly used for prices, temperatures, mathematical expressions, navigation, branding, and special characters.

Written by Shubhranshu Shekhar, who has trained 20000+ students in coding.

Related Posts

Scroll to Top