Спеціальні символи HTML таблиця
BlogСпеціальні символи HTML таблиця для використання в коді
Часто в HTML потрібно вставити символ, якого немає на клавіатурі
У веброзробці трапляються ситуації, коли потрібно вставити символ, якого немає в стандартній розкладці клавіатури. Наприклад, це можуть бути типографічні символи авторського права ©, зареєстрованої торгової марки ®, або спеціальні математичні позначення — наприклад, дріб ¾ чи знак «плюс-мінус» ±. Також часто використовують грецькі літери — α, β, γ — у наукових або технічних текстах.
Вставляти такі символи напряму з буфера обміну — не найкраще рішення. У різних браузерах чи мовних локалях вони можуть некоректно відображатися або втрачатися при обробці контенту. Саме тому в HTML передбачені іменовані © та числові © коди, які дозволяють стабільно відображати ці знаки в будь-яких умовах.
Щоб пришвидшити верстку і зменшити кількість помилок, я підготував корисний ресурс — це таблиця з найпопулярнішими HTML-спецсимволами. Тут ви знайдете корисні елементи на кшталт нерозривного пробілу , французьких лапок «» « і », валютних знаків € → € та багатьох інших.
Категорії HTML спецсимволів
- Загальні спеціальні символи HTML
- Пробіли та переноси
- Знаки пунктуації
- Знаки авторського права
- Математичні оператори
- Валютні знаки
- Маркери
- Кавички
- Стрілки
- Грецькі літери
- Інші символи
| Символ | HTML-код | Мнемоніка | Опис |
|---|---|---|---|
| Пробіли та переноси | |||
| |   | Нерозривний пробіл | |
|   |   | Узкий пробіл (en-шириной) | |
|   |   | Широкий пробіл (em-шириной) | |
| – | – | – | Узке тире (en-тире) |
| — | — | — | Широке тире (em-тире) |
| ‾ | ‾ | ‾ | Надчеркування |
| ¯ | ¯ | ¯ | Горизонтальна лінія над символом |
| | ­ | ­ | М’який перенос |
| Знаки пунктуації | |||
| . | . | . | Точка |
| ¨ | ¨ | ¨ | Умлаут |
| … | … | … | Многоточчя |
| , | , | , | Кома |
| ! | ! | ! | Вигуковий знак |
| ? | ? | ? | Питальний знак |
| : | : | : | Двоеточie |
| ; | ; | ; | Точка з комою |
| ( | ( | ( | Ліва дужка |
| ) | ) | ) | Права дужка |
| [ | [ | [ | Ліва квадратна дужка |
| ] | ] | ] | Права квадратна дужка |
| { | { | { | Ліга фігурна дужка |
| } | } | } | Права фігурна дужка |
| ´ | ´ | ´ | Гострий акцент |
| ` | ` | ` | Тупий акцент |
| ˜ | ˜ | ˜ | Тильда |
| | | | | | | Вертикальна смуга |
| _ | _ | _ | Підкреслення |
| Знаки авторського права | |||
| © | © | © | Копірайт |
| ® | ® | ® | Знак зареєстрованої торгової марки |
| ™ | ™ | ™ | Знак торгової марки |
| Математичні оператори | |||
| × | × | × | Множити |
| ÷ | ÷ | ÷ | Ділити |
| < | < | < | Менше |
| > | > | > | Більше |
| ± | ± | ± | Плюс/мінус |
| ¹ | ¹ | ¹ | Степінь 1 |
| ² | ² | ² | Степінь 2 |
| ³ | ³ | ³ | Степінь 3 |
| ¬ | ¬ | ¬ | Одмова |
| ¼ | ¼ | ¼ | Одна четверта |
| ½ | ½ | ½ | Одна друга |
| ¾ | ¾ | ¾ | Три четверти |
| ⁄ | ⁄ | ⁄ | Дробова лінія |
| − | − | − | Мінус |
| ≤ | ≤ | ≤ | Менше або дорівнює |
| ≥ | ≥ | ≥ | Більше або дорівнює |
| ≈ | ≈ | ≈ | Приблизно дорівнює |
| ≠ | ≠ | ≠ | Не дорівнює |
| ≡ | ≡ | ≡ | Тотожність |
| √ | √ | √ | Квадратний корінь |
| ∞ | ∞ | ∞ | Бескінченність |
| ∑ | ∑ | ∑ | Знак сумування |
| ∏ | ∏ | ∏ | Знак добутку |
| ∂ | ∂ | ∂ | Частковий диференціал |
| ∫ | ∫ | ∫ | Інтеграл |
| ∀ | ∀ | ∀ | Для всіх |
| ∃ | ∃ | ∃ | Існує |
| ∅ | ∅ | ∅ | Пуста множина |
| ∈ | ∈ | ∈ | Належить |
| ∉ | ∉ | ∉ | Не належить |
| ∋ | ∋ | ∗ | Містить |
| ⊂ | ⊂ | ⊂ | Являється підмножиною |
| ⊃ | ⊃ | ⊃ | Являється надмножиною |
| ⊄ | ⊄ | ⊄ | Не є підмножиною |
| ⊆ | ⊆ | ⊆ | Являється підмножиною або дорівнює |
| ⊇ | ⊇ | ⊇ | Являється надмножиною або дорівнює |
| ⊕ | ⊕ | ⊕ | Плюс у колі |
| ⊗ | ⊗ | ⊗ | Множення у колі |
| ⊥ | ⊥ | ⊥ | Перпендикулярно |
| ∠ | ∠ | ∠ | Кут |
| ∧ | ∧ | ∧ | Логічне І |
| ∨ | ∨ | ∨ | Логічне ІЛИ |
| ∩ | ∩ | ∩ | Перетин |
| ∪ | ∪ | ∪ | Об'єднання |
| Валютні знаки | |||
| ¤ | ¤ | ¤ | Знак валюти |
| ₴ | ₴ | ₴ | Гривня (UAH) |
| $ | $ | $ | Долар |
| € | € | € | Євро |
| ¢ | ¢ | ¢ | Цент |
| £ | £ | £ | Фунт |
| ¥ | ¥ | ¥ | Йена |
| ƒ | ƒ | ƒ | Знак флорину |
| Маркери | |||
| • | • | • | Простий маркер |
| ● | ● | ● | Середній маркер |
| ⬤ | ⬤ | ⬤ | Біг маркер |
| ˚ | ˚ | ˚ | Коло під символом |
| ○ | ○ | ○ | Круг |
| ◯ | ◯ | ◯ | Біг круг |
| · | · | · | Середня точка |
| ˙ | ˙ | ̇ | Точка над символом |
| ° | ° | ° | Градус |
| Кавички | |||
| ' | ' | ' | Одинарна кавичка |
| " | " | " | Двостороння кавичка |
| ‹ | ‹ | ‹ | Одинарна углова кавичка (відкриваюча) |
| › | › | › | Одинарна углова кавичка (закриваюча) |
| « | « | « | Ліва типографська кавичка (елочка) |
| » | » | » | Права типографська кавичка (елочка) |
| ′ | ′ | ′ | Штрих (хвилини, фути) |
| ″ | ″ | ″ | Подвійний штрих (секунди, дюйми) |
| ‘ | ‘ | ‘ | Ліва верхня одинарна кавичка |
| ’ | ’ | ’ | Права верхня одинарна кавичка |
| ‚ | ‚ | ‚ | Права нижня одинарна кавичка |
| “ | “ | “ | Ліва двостороння кавичка |
| ” | ” | ” | Права двостороння кавичка |
| „ | „ | „ | Права нижня двостороння кавичка |
| ˝ | ˝ | ˢ | Подвійний акцент |
| Стрілки | |||
| ← | ← | ← | Стрілка вліво |
| ↑ | ↑ | ↑ | Стрілка вгору |
| → | → | → | Стрілка вправо |
| ↓ | ↓ | ↓ | Стрілка вниз |
| ↔ | ↔ | ↔ | Стрілка вліво і вправо |
| ↕ | ↕ | ↕ | Стрілка вгору і вниз |
| ⇐ | ⇐ | ⇐ | Подвійна стрілка вліво |
| ⇑ | ⇑ | ⇑ | Подвійна стрілка вгору |
| ⇒ | ⇒ | ⇒ | Подвійна стрілка вправо |
| ⇓ | ⇓ | ⇓ | Подвійна стрілка вниз |
| ⇔ | ⇔ | ⇔ | Подвійна стрілка вліво і вправо |
| ⇕ | ⇕ | ⇕ | Подвійна стрілка вгору і вниз |
| ˆ | ˆ | ˆ | Коло над символом |
| ˇ | ˇ | ˇ | Карон (хвостик) |
| Грецькі літери | |||
| α | α | α | Ґрецька літера Альфа |
| β | β | β | Ґрецька літера Бета |
| γ | γ | γ | Ґрецька літера Гамма |
| π | π | π | Ґрецька літера Пі |
| ω | ω | ω | Ґрецька літера Омега |
| Інші символи | |||
| & | & | & | Амперсанд |
| ¦ | ¦ | ¦ | Вертикальний пунктир |
| @ | @ | @ | Знак "собачка" (@) |
| ∗ | ∗ | ∗ | Нижнє зірочка |
| § | § | § | Параграф |
| µ | µ | µ | Знак "мікро" |
| ¶ | ¶ | ¶ | Знак абзацу |
| № | № | № | Знак номера |
| º | º | º | Коп'є Марса |
| ª | ª | ª | Зеркало Венери |
| ‰ | ‰ | ‰ | Проміле |
| ★ | ★ | ★ | Зірочка (чорна) |
| ☆ | ☆ | ☆ | Порожня зірочка |
| ✶ | — | ✶ | Декоративна зірка |
| ❊ | — | ❊ | Квіткова зірка |
| ✱ | — | ✱ | Великий астеріск |
| ❄ | — | ❄ | Сніжинка |
| ❅ | — | ❅ | Сніжинка з шістьма кінцями |
| ❋ | — | ❋ | Квіткова сніжинка |
| ✓ | ✓ | ✓ | Галочка |
| ✔ | ✔ | ✔ | Чорна галочка |
| ✘ | ✘ | ✘ | Хрестик у колі |
| † | † | † | Хрестик |
| ‡ | ‡ | ‡ | Подвійний хрестик |
| ♠ | ♠ | ♠ | Пики |
| ♣ | ♣ | ♣ | Трефи |
| ♥ | ♥ | ♥ | Черви |
| ♦ | ♦ | ♦/td> | Бубни |
| ◊ | ◊ | ◊ | Ромб |
Як правильно використовувати HTML-символи?
-
Для виведення зарезервованих символів.
HTML сприймає
<і>як частину тегів. Якщо написати<p> 5 < 10 </p>, браузер може сприйняти< 10>як відкриття та закриття тега. Щоб цього уникнути, потрібно використовувати<для<і>для>. Тому<p>5 < 10</p>правильно відобразить5 < 10. -
Для вставки символів, яких немає на клавіатурі.
Деякі символи відсутні на клавіатурі, наприклад
€для€або©для© -
Для нерозривного пробілу.
корисний для уникнення небажаних перенесень тексту на новий рядок. -
При використанні в коді HTML та JavaScript.
Якщо у коді потрібно вивести
&або< >, потрібно використовувати відповідні HTML-entity (&або<та>).
Спеціальні HTML символи дозволяють коректно відображати текст, не викликаючи конфліктів у коді. Використовуйте їх у тих випадках, коли потрібно показати зарезервовані знаки, уникнути проблем із кодуванням або вставити спеціальні символи, яких немає на клавіатурі. Це допоможе зробити вебсторінку більш доступною та правильною у відображенні контенту.