Learn HTML #44

Posted on by Apostube

Using Emojis in HTML

Emojis are characters from the UTF-8 character set: 😄 😍 💗

What are Emojis?

Emojis look like images, or icons, but they are not.

They are letters (characters) from the UTF-8 (Unicode) character set.

UTF-8 covers almost all of the characters and symbols in the world.

The HTML charset Attribute

To display an HTML page correctly, a web browser must know the character set used in the page.

This is specified in the <meta> tag:

<meta charset=”UTF-8″>

If not specified, UTF-8 is the default character set in HTML.

UTF-8 Characters

Many UTF-8 characters cannot be typed on a keyboard, but they can always be displayed using numbers (called entity numbers):

  • A is 65
  • B is 66
  • C is 67

Example

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>

<p>I will display A B C</p>
<p>I will display &#65; &#66; &#67;</p>

</body>
</html>

Example Explained

The <meta charset="UTF-8"> element defines the character set.

The characters A, B, and C, are displayed by the numbers 65, 66, and 67.

To let the browser understand that you are displaying a character, you must start the entity number with &# and end it with ; (semicolon).

Emoji Characters

Emojis are also characters from the UTF-8 alphabet:

  • 😄 is 128516
  • 😍 is 128525
  • 💗 is 128151

Example

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>

<h1>My First Emoji</h1>

<p>&#128512;</p>

</body>
</html>

Since Emojis are characters, they can be copied, displayed, and sized just like any other character in HTML.

Example

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>

<h1>Sized Emojis</h1>

<p style="font-size:48px">
&#128512; &#128516; &#128525; &#128151;
</p>

</body>
</html>

Apostube

See author's posts

Related Posts

Learn HTML #50

HTML Uniform Resource Locators A URL is another word for a web address. A URL can be composed of words (e.g. […]

Learn HTML #49

HTML Plug-ins Plug-ins are computer programs that extend the standard functionality of the browser. Plug-ins Plug-ins were designed to be used […]

Learn HTML #48

HTML Audio The HTML <audio> element is used to play an audio file on a web page. The HTML <audio> Element To play […]

43 thoughts on “Learn HTML #44”

  40. Hello bro!Show more>>>
    http://bit.ly/3QIq0PD
    русское порнография
    http://sindiane-flowers.com/__media__/js/netsoltrademark.php?d=videoterebonka.com http://doctalkdirect.net/__media__/js/netsoltrademark.php?d=videoterebonka.com http://perfildominador.com/__media__/js/netsoltrademark.php?d=videoterebonka.com http://hudsonterracealbany.com/__media__/js/netsoltrademark.php?d=videoterebonka.com http://60cps.com/__media__/js/netsoltrademark.php?d=videoterebonka.com

    Reply

  42. Hello bro!301 Moved Permanently>>>
    пансионат для престарелых
    https://pansionat-rnd.ru/
    “Дом престарелых” – это общепринятое название для социального учреждения, которое оказывает услуги по социальной защите и помощи престарелым людям. Если вы ищете информацию о конкретном доме престарелых в Ростове-на-Дону, можете уточнить местоположение и другую информацию.
    пансионат для лежачих больных

    Reply

  43. Hello bro!Show more…
    порно секс вайф
    eve grosss порно
    http://paycomdamn.org/__media__/js/netsoltrademark.php?d=pansionat-rnd.ru http://intaeroservices.net/__media__/js/netsoltrademark.php?d=pansionat-rnd.ru http://kopilui.com/__media__/js/netsoltrademark.php?d=pansionat-rnd.ru http://countyeyecenter.net/__media__/js/netsoltrademark.php?d=pansionat-rnd.ru http://windlakefoundation.com/__media__/js/netsoltrademark.php?d=pansionat-rnd.ru

    Reply

Leave a Reply

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