Geek Slack

Introduction to HTML
About Lesson



HTML Symbols


HTML Symbols

HTML symbols allow you to display special characters that are not typically found on a keyboard or have special meanings in HTML. These symbols are represented by character entities that start with an ampersand (&) and end with a semicolon (;).

1. Mathematical Symbols

Mathematical symbols can be used to represent operators, relations, and other mathematical notations.

Example:

Common mathematical symbols include:

  • + = +
  • − = -
  • × = ×
  • ÷ = ÷
  • = = =
  • ≠ = ≠
  • ≤ = ≤
  • ≥ = ≥

Example usage in HTML:

<p>5 &plus; 3 = 8</p>

This will display as:

5 + 3 = 8

2. Currency Symbols

Currency symbols represent different types of currency.

Example:

Common currency symbols include:

  • &dollar; = $
  • &euro; = €
  • &pound; = £
  • &yen; = ¥
  • &cent; = ¢

Example usage in HTML:

<p>The price is &dollar;99.99</p>

This will display as:

The price is $99.99

3. Arrow Symbols

Arrow symbols can be used to represent different directions or flows.

Example:

Common arrow symbols include:

  • &larr; = ←
  • &rarr; = →
  • &uarr; = ↑
  • &darr; = ↓
  • &harr; = ↔

Example usage in HTML:

<p>Go &larr; Left or &rarr; Right</p>

This will display as:

Go ← Left or → Right

4. Punctuation Symbols

Punctuation symbols can be represented using HTML entities to ensure they are displayed correctly.

Example:

Common punctuation symbols include:

  • &quot; = "
  • &apos; = '
  • &comma; = ,
  • &period; = .
  • &excl; = !
  • &quest; = ?

Example usage in HTML:

<p>He said &quot;Hello&quot;.</p>

This will display as:

He said “Hello”.

5. Other Common Symbols

HTML entities can be used to represent various other symbols.

Example:

Some other commonly used symbols include:

  • &copy; = ©
  • &reg; = ®
  • &trade; = ™
  • &sect; = §
  • &para; = ¶
  • &bull; = •

Example usage in HTML:

<p>&copy; 2024 Your Company. All rights reserved.</p>

This will display as:

© 2024 Your Company. All rights reserved.

Conclusion

Using HTML symbols allows you to include a wide range of special characters in your web pages. Understanding and utilizing these symbols ensures your content is displayed accurately and improves the overall readability and professionalism of your website.

Join the conversation