Learn HTML Symbols

Tips (Total 4)

1. What is HTML Symbols

2. Some Mathematical Symbols Supported by HTML

3. Some Greek Letters Supported by HTML

4. Some Other Entities Supported by HTML

# Tips-1) What is HTML Symbols

Symbols or letters that are not present on your keyboard can be added to HTML using entities.

HTML entities were described in the previous chapter.

Many mathematical, technical, and currency symbols, are not present on a normal keyboard.

Display the euro sign:

To add such symbols to an HTML page, you can use the entity name or the entity number (a decimal or a hexadecimal reference) for the symbol:

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<p>I will display &euro;</p>
<p>I will display &#8364;</p>
<p>I will display &#x20AC;</p>

</body>
</html>

Output should be:

# Tips-2) Some Mathematical Symbols Supported by HTML

Here is some examples of HTML Symbols.

Display the for-all symbol

∀

∀

∀

For all

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<h1>Mathematical Symbol Example</h1>

<h2>The for-all symbol: &forall;</h2>

</body>
</html>

Output should be:

Display the partial differential symbol

∂

∂

∂

Partial differential

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<h1>Mathematical Symbol Example</h1>

<h2>The partial differential symbol: &part;</h2>

</body>
</html>

Output should be:

Display the exist symbol

∃

∃

∃

There exists

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<h1>Mathematical Symbol Example</h1>

<h2>The there-exists symbol: &exist;</h2>

</body>
</html>

Output should be:

Display the empty-sets symbol

∅

∅

∅

Empty sets

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<h1>Mathematical Symbol Example</h1>

<h2>The empty-sets symbol: &empty;</h2>

</body>
</html>

Output should be:

Display the nabla symbol

∇

∇

∇

Nabla

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<h1>Mathematical Symbol Example</h1>

<h2>The nabla symbol: &nabla;</h2>

</body>
</html>

Output should be:

Display the element-of symbol

∈

∈

∈

Element of

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<h1>Mathematical Symbol Example</h1>

<h2>The element-of symbol: &isin;</h2>

</body>
</html>

Output should be:

Display the not-an-element-of symbol

∉

∉

∉

Not an element of

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<h1>Mathematical Symbol Example</h1>

<h2>The not-an-element-of symbol: &notin;</h2>

</body>
</html>

Output should be:

Display contains-a-member symbol

∋

∋

&ni;

Contains as member

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<h1>Mathematical Symbol Example</h1>

<h2>The contains-a-member symbol: &ni;</h2>

</body>
</html>

Output should be:

Display the product symbol

∏

∏

∏

N-ary product

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<h1>Mathematical Symbol Example</h1>

<h2>The product symbol: &prod;</h2>

</body>
</html>

Output should be:

Display the sum symbol

∑

∑

∑

N-ary summation

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<h1>Mathematical Symbol Example</h1>

<h2>The summation symbol: &sum;</h2>

</body>
</html>

Output should be:

# Tips-3) Some Greek Letters Supported by HTML

Char	Number	Entity	Description
Α	Α	Α	GREEK ALPHA	Try It

Β	Β	Β	GREEK BETA	Try It
Γ	Γ	Γ	GREEK GAMMA	Try It
Δ	Δ	Δ	GREEK DELTA	Try It
Ζ	Ζ	Ζ	GREEK ZETA	Try It

GREEK ALPHA

Α

Α

Α

GREEK ALPHA

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<h1>Greek Letter Example</h1>

<h2>The capital alpha letter: Α</h2>

</body>
</html>

Output should be:

GREEK BETA

Β

Β

Β

GREEK BETA

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<h1>Greek Letter Example</h1>

<h2>The capital beta letter: Β</h2>

</body>
</html>

Output should be:

GREEK GAMMA

Γ

Γ

Γ

GREEK GAMMA

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<h1>Greek Letter Example</h1>

<h2>The capital gamma letter: Γ</h2>

</body>
</html>

Output should be:

GREEK DELTA

Δ

Δ

Δ

GREEK DELTA

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<h1>Greek Letter Example</h1>

<h2>The capital delta letter: Δ</h2>

</body>
</html>

Output should be:

GREEK ZETA

Ζ

Ζ

Ζ

GREEK ZETA

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<h1>Greek Letter Example</h1>

<h2>The capital zeta letter: Ζ</h2>

</body>
</html>

Output should be:

# Tips-4) Some Other Entities Supported by HTML

©

©

©

COPYRIGHT

®	®	®	REGISTERED	Try It
€	€	€	EURO SIGN	Try It
™	™	™	TRADEMARK	Try It
←	←	←	LEFT ARROW	Try It
↑	↑	↑	UP ARROW	Try It
→	→	→	RIGHT ARROW	Try It
↓	↓	↓	DOWN ARROW	Try It
♠	♠	♠	SPADE	Try It
♣	♣	♣	CLUB	Try It
♥	♥	♥	HEART	Try It
♦	♦	♦	DIAMOND	Try It

COPYRIGHT

©

©

©

COPYRIGHT

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<h1>HTML Entity Example</h1>

<h2>The copyright symbol: ©</h2>

</body>
</html>

Output should be:

REGISTERED

®

®

®

REGISTERED

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<h1>HTML Entity Example</h1>

<h2>The registered symbol: ®</h2>

</body>
</html>

Output should be:

EURO SIGN

€

€

€

EURO SIGN

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<h1>HTML Entity Example</h1>

<h2>The euro symbol: €</h2>

</body>
</html>

Output should be:

TRADEMARK

™

™

™

TRADEMARK

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<h1>HTML Entity Example</h1>

<h2>The trademark symbol: ™</h2>

</body>
</html>

Output should be:

LEFT ARROW

←

←

←

LEFT ARROW

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<h1>HTML Entity Example</h1>

<h2>The arrow-left symbol: ←</h2>

</body>
</html>

Output should be:

UP ARROW

↑

↑

↑

UP ARROW

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<h1>HTML Entity Example</h1>

<h2>The arrow-up symbol: ↑</h2>

</body>
</html>

Output should be:

RIGHT ARROW

→

→

→

RIGHT ARROW

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<h1>HTML Entity Example</h1>

<h2>The arrow-right symbol: →</h2>

</body>
</html>

Output should be:

DOWN ARROW

↓

↓

↓

DOWN ARROW

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<h1>HTML Entity Example</h1>

<h2>The arrow-down symbol: ↓</h2>

</body>
</html>

Output should be:

SPADE

♠

♠

&spades;

SPADE

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<h1>HTML Entity Example</h1>

<h2>The black-spade-suit symbol: ♠</h2>

</body>
</html>

Output should be:

CLUB

♣

♣

&clubs;

CLUB

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<h1>HTML Entity Example</h1>

<h2>The black-club-suit symbol: ♣</h2>

</body>
</html>

Output should be:

HEART

♥

♥

&hearts;

HEART

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<h1>HTML Entity Example</h1>

<h2>The black-heart symbol: ♥</h2>

</body>
</html>

Output should be:

DIAMOND

♦

♦

&diams;

DIAMOND

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<h1>HTML Entity Example</h1>

<h2>The black-diamond symbol: ♦</h2>

</body>
</html>

Output should be: