Los emojis son letras (caracteres) del juego de caracteres UTF-8 (Unicode). El elemento <meta charset=”UTF-8″> en HTML define el juego de caracteres. Muchos caracteres UTF-8 no se pueden escribir en un teclado, pero siempre se pueden mostrar mediante números (llamados números de entidad). Para que el navegador comprenda que está mostrando un carácter, debe comenzar el número de entidad con y terminar con ; (punto y coma).
Sintaxis:
<head>
<meta charset="UTF-8">
</head>
<body>
<p>&#number;</p>
// Take 'number' corresponding
// to UTF-8 characters you want
// to display.
</body>
Los emojis también son caracteres del alfabeto UTF-8 y se pueden usar en HTML mencionando la correspondiente referencia emoji, decimal (dec) o hexadecimal (hex) en la sintaxis anterior.
Ejemplo: representar los siguientes emoji en una página web.
HTML
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> </head> <body> <h1>Geeks For Geeks</h1> <h2>HTML Emojis </h2> <p>😄</p> <p>✌</p> <p>🕞</p> </body> </html>
Producción:
En el ejemplo anterior, la referencia decimal utilizada para los siguientes emojis es la siguiente
| Carbonizarse | Referencia decimal | referencia hexadecimal |
|---|---|---|
| 😄 | 128516 | 1F604 |
| ✌ | 9996 | 270C |
| 🕞 | 128350 | 1F55E |
Nota: En lugar de la referencia decimal (dec), también se puede usar la referencia hexadecimal (hexadecimal) para mostrar emoji en una página web. Además de la sintaxis anterior, es necesario incluir ‘x’ antes de la referencia hexadecimal.
Sintaxis:
<p>&#xhexaDecimal;</p>
Ejemplo: En este ejemplo, representaremos emoji 😄, ✌ y 🕞 en una página web con referencia hexadecimal (hexadecimal).
HTML
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> </head> <body> <h1>Geeks For Geeks</h1> <h2>HTML Emojis</h2> <p>😄</p> <p>✌</p> <p>🕞</p> </body> </html>
Producción:
Con la referencia hexadecimal también obtenemos el mismo resultado.
Nota: Dado que los emojis son caracteres, se pueden copiar, mostrar y cambiar de tamaño como cualquier otro carácter en HTML.
Ejemplo: En este ejemplo, cambiaremos el tamaño de letra de los siguientes emojis 😄, ✌ y 🕞.
HTML
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> </head> <body> <h1>Geeks For Geeks</h1> <h2>HTML Emojis with different font size </h2> <p style="font-size:25px">😄 </p> <p style="font-size:65px">✌</p> <p style="font-size:75px">🕞</p> </body> </html>
Salida: La salida contiene los diferentes tamaños de emojis.
De manera similar, cualquier emoji se puede mostrar en una página web ingresando la referencia decimal o hexadecimal correspondiente en un código.
Publicación traducida automáticamente
Artículo escrito por deepak710agarwal y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA