Использование эмодзи в HTML
Эмодзи (эмоджи, смайлы) - это символы из набора символов UTF-8: 😄 😍 💗
Некоторые символы эмодзи в UTF-8
| Эмодзи | Значение | |
|---|---|---|
| 🗻 | 🗻 | Попробуй это » |
| 🗼 | 🗼 | Попробуй это » |
| 🗽 | 🗽 | Попробуй это » |
| 🗾 | 🗾 | Попробуй это » |
| 🗿 | 🗿 | Попробуй это » |
| 😀 | 😀 | Попробуй это » |
| 😁 | 😁 | Попробуй это » |
| 😂 | 😂 | Попробуй это » |
| 😃 | 😃 | Попробуй это » |
| 😄 | 😄 | Попробуй это » |
| 😅 | 😅 | Попробуй это » |
Полный справочник HTML Эмодзи.
HTML Эмодзи - Примеры
🚀🚁🚂🚃🚄
HTML Эмодзи. Транспортные символы
💺💻💼💽💾
👮👯👰👱👲
🐂🐃🐄🐅🐆
Что такое эмодзи?
Эмодзи (смайлы) выглядят как изображения или значки, но на самом деле это не так.
Это буквы (символы) из набора символов UTF‑8 (Unicode).
UTF‑8 охватывает почти все значки (иконки) и символы в мире.
HTML атрибут charset
Чтобы браузер корректно отобразил HTML‑страницу, он должен знать, какой набор символов используется на странице.
Это указывается в теге <meta>:
<meta charset="UTF-8">
Если не указано, UTF-8 является набором символов по умолчанию в HTML.
Набор символов UTF‑8
Многие символы UTF‑8 невозможно ввести с клавиатуры, но их всегда можно отобразить с помощью числовых кодов (которые называются номерами сущностей):
- A - это 65
- B - это 66
- C - это 67
Пример
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<p>Я буду отображать A B C</p>
<p>Я буду отображать A B C</p>
</body>
</html>
Попробуйте сами »
Пояснение примера
Элемент <meta charset="UTF-8"> определяет набор символов.
Символы A, B и C отображаются с помощью чисел 65, 66 и 67.
Чтобы браузер понял, что вы выводите символ по его коду, номер сущности должен начинаться с &# и заканчиваться точкой с запятой ;
Эмодзи‑символы
Эмодзи — это тоже символы алфавита UTF‑8:
- 😄 - это 128516
- 😍 - это 128525
- 💗 - это 128151
Пример
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<h1>Мой первый эмодзи</h1>
<p>😀</p>
</body>
</html>
Попробуйте сами »
Поскольку эмодзи являются символами, их можно копировать, отображать и изменять размер, как любой другой символ в HTML.
Пример
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<h1>Размер эмодзи</h1>
<p style="font-size:48px">
😀 😄 😍 💗
</p>
</body>
</html>
Попробуйте сами »
Некоторые символы эмодзи в UTF-8
| Эмодзи | Значение |
|---|---|
| 🗻 | 🗻 |
| 🗼 | 🗼 |
| 🗽 | 🗽 |
| 🗾 | 🗾 |
| 🗿 | 🗿 |
| 😀 | 😀 |
| 😁 | 😁 |
| 😂 | 😂 |
| 😃 | 😃 |
| 😄 | 😄 |
| 😅 | 😅 |
Полный список эмодзи можно найти в HTML Эмодзи справочнике на нашем сайте W3Schools на русском.
