Używanie emotikonów w HTML
Emoji to znaki z zestawu znaków UTF-8: 😄 😍 💗
Czym są emotikony?
Emotikony wyglądają jak obrazy lub ikony, ale nimi nie są.
Są to litery (znaki) z zestawu znaków UTF-8 (Unicode).
UTF-8 obejmuje prawie wszystkie znaki i symbole na świecie.
Atrybut zestawu znaków HTML
Aby poprawnie wyświetlić stronę HTML, przeglądarka internetowa musi znać zestaw znaków użyty na stronie.
Jest to określone w <meta>
tagu:
<meta charset="UTF-8">
Jeśli nie określono, UTF-8 jest domyślnym zestawem znaków w HTML.
Znaki UTF-8
Wielu znaków UTF-8 nie można wpisać na klawiaturze, ale zawsze można je wyświetlić za pomocą cyfr (nazywanych numerami jednostek):
- A to 65
- B to 66
- C to 67
Przykład
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<p>I will display A B C</p>
<p>I will display A B C</p>
</body>
</html>
Przykład wyjaśniony
Element <meta charset="UTF-8">
definiuje zestaw znaków.
Znaki A, B i C są wyświetlane pod numerami 65, 66 i 67.
Aby przeglądarka zrozumiała, że wyświetlasz znak, musisz rozpocząć numer jednostki od i zakończyć go od ; (średnik).
Znaki Emoji
Emoji to także znaki z alfabetu UTF-8:
- 😄 to 128516
- 😍 to 128525
- 💗 to 128151
Przykład
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<h1>My First Emoji</h1>
<p>😀</p>
</body>
</html>
Ponieważ emotikony są znakami, można je kopiować, wyświetlać i zmieniać rozmiar, tak jak każdy inny znak w HTML.
Przykład
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<h1>Sized Emojis</h1>
<p style="font-size:48px">
😀 😄 😍 💗
</p>
</body>
</html>
Niektóre symbole Emoji w UTF-8
Emoji | Wartość | Spróbuj |
---|---|---|
🗻. | | |
🗼. | | |
🗽. | | |
🗾. | | |
🗿. | | |
😀. | | |
😁. | | |
😂. | | |
😃. | | |
😄. | | |
😅. | |
Aby uzyskać pełną listę, przejdź do naszego dokumentu HTML Emoji Reference .