Специальные символы для вставки в HTML и CSS

Количество просмотров: 634

При создании сайта частенько появляется необходимость вставить в документ какой нибудь специальный символ, например знак валюты, рубля или евро, или, например, знак копирайта.

Однако, на клавиатуре данных символов нет. Как же быть?

В данном случае нам на помощь придут специальные-символы html. Начинаются они обычно с амперсанда - & и заканчиваются точкой с запятой.

Для того, чтобы вставить символ в свою страницу просто скопируйте нужный вам символ и вставляете в свой документ. Для использования в таблицах стилей воспользуйтесь CSS свойством content:

Ниже представлены несколько таблиц со специальными-символов разбитыми по группам.

Популярные спецсимволы

Внешний вид HTML-CODE CSS-CODE Описание
☭ \262D Серп и молот
☣ \2623 Знак биологической опасности
☯ \262F Инь ян
⚓ \2693 Якорь
☎ \260E Телефон
✆ \2706 Знак телефона
☦ \2626 Православный крест
☕ \2615 Горячие напитки
✎ \270E Карандаш, направленный вправо-вниз
✏ \270F Карандаш
✐ \2710 Карандаш, направленный вправо-вверх
✑ \2711 Незакрашенное острие пера
✒ \2712 Закрашенное острие пера
⚜ \269C Геральдическая лилия
⛑ \26D1 Шлем с белым крестом
⚝ \269D Начерченная белая звезда
❄ \2744 Снежинка
❤ \2764 Закрашенное сердце
❅ \2745 Зажатая трилистниками снежинка
❆ \2746 Жирная остроугольная снежинка
★ \2605 Закрашенная звезда
☆ \2606 Незакрашенная звезда
✪ \272A Незакрашенная звезда в закрашенном круге
✫ \272B Закрашенная звезда с незакрашенным кругом внутри
✯ \272F Вращающаяся звезда
❉ \2749 Звёздочка с шарообразными окончаниями
❋ \274B Жирная восьмиконечная звезда
✲ \2732 Звёздочка с незакрашенным центром
⁂ \2042 Три звездочки
☀ \2600 Закрашенное солнце с лучами
✿ \273f Закрашенный цветок
❀ \2740 Незакрашенный цветок
✾ \273E Цветок с шестью лепестками
❁ \2741 Закрашенный обведённый цветок
❂ \2742 Цветок из точек
☁ \2601 Облака
☂ \2602 Зонтик
☑ \2611 Галочка в квадрате
☒ \2612 Крестик в квадрате
☹ \2639 Нахмуренный смайлик
☺ \263A Улыбающийся смайлик
☻ \263B Закрашенный улыбающийся смайлик
⚑ \2691 Закрашенный флаг
⚐ \2690 Незакрашенный флаг
☰ \2630 Триграмма
✉ \2709 Конверт
❦ \2766 Сердце в виде цветка
❶ \2776 Номер 1
❷ \2777 Номер 2
❸ \2778 Номер 3
❹ \2779 Номер 4
❺ \277A Номер 5
❻ \277B Номер 6
❼ \277C Номер 7
❽ \277D Номер 8
➒ \2792 Номер 9
➓ \2793 Номер 10
✖ \2716 Жирный знак умножения
✘ \2718 Жирный крестик
✔ \2714 Жирная отметка галочкой
✚ \271A Жирный крест
⚛ \269B Символ атома
♺ \267A Символ переработки
◐ \25D0 Круг с левой закрашенной половиной
◑ \25D1 Круг с закрашенной правой половиной
❑ \2751 Незакрашенный квадрат с правой нижней тенью
❒ \2752 Незакрашенный квадрат с правой верхней тенью
◈ \25C8 Закрашенный ромб
☠ \2620 Череп и кости

Специальные символы стрелок

Внешний вид HTML-CODE CSS-CODE Описание
↵ \21B5 Стрелка вниз и влево – знак возврата каретки
↓ \2193 Стрелка вниз
↑ \2191 Стрелка вверх
→ \2192 Стрелка вправо
← \2190 Стрелка влево
↔ \2194 Стрелка влево-вправо
⇒ \21D2 Двойная стрелка направо
⇐ \21D0 Двойная стрелка налево
⇑ \21D1 Двойная стрелка вверх
⇓ \21D3 Двойная стрелка вниз
⇔ \21D4 Двойная стрелка влево-вправо
➠ \27A0 Летящая стрела
➤ \27A4 Наконечник стрелы
➥ \27A5 Изогнутая стрела, вниз и вправо
➦ \27A6 Изогнутая стрела, вверх и вправо
➳ \27B3 Стрела направо
↺ \21BA Круглая стрелка против часовой стрелки
↻ \21BB Круглая стрелка против часовой стрелки
⇧ \21E7 Толстая полая стрелка вверх
↩ \21A9 Стрелка налево с крючком
➫ \27AB Наклонённая вниз объёмная стрелка
⬆ \2B06 Закрашенная стрелка вверх
⬇ \2B07 Закрашенная стрелка вниз

Математические символы и знаки пунктуации

Внешний вид HTML-CODE CSS-CODE Описание
© © \00A9 Знак copyright
® ® \00AE Знак зарегистрированной торговой марки
@ @ \0040 Символ собака
­ ­ \00AD Место возможного переноса
< &lt; \003C Знак "меньше чем" (начало тега)
> &gt; \003E Знак "больше чем" (конец тега)
« &laquo; \00AB Левая двойная угловая скобка
» &raquo; \00BB Правая двойная угловая скобка
&lsaquo; \2039 Левая угловая одиночная кавычка
&rsaquo; \203A Правая угловая одиночная кавычка
" &quot; \0022 Двойная кавычка
&prime; \2032 Одиночный штрих
&Prime; \2033 Двойной штрих
&lsquo; \2018 Левая одиночная кавычка
&rsquo; \2019 Правая одиночная кавычка
&sbquo; \201A Нижняя одиночная кавычка
&ldquo; \201C Левая двойная кавычка
&rdquo; \201D Правая двойная кавычка
&bdquo; \201E Нижняя двойная кавычка
&#10076; \275C Жирная одинарная верхняя запятая
&#10075; \275B Жирная одинарная повёрнутая верхняя запятая
& &amp; \0026 Амперсанд
' &apos; \0027 Апостроф (одинарная кавычка)
§ &sect; \00A7 Параграф
  &nbsp; \00A0 Неразрывный пробел
¬ &not; \00AC Знак отрицания
¯ &macr; \00AF Знак долготы над гласным
° &deg; \00B0 Градус
± &plusmn; \00B1 Плюс-минус
¹ &sup1; \00B9 Верхний индекс "1"
² &sup2; \00B2 Верхний индекс "2"
³ &sup3; \00B3 Верхний индекс "3"
½ &frac12; \00BD Одна вторая
¼ &frac14; \00BC Одна четверть
¾ &frac34; \00BE Три четверти
´ &acute; \00B4 Знак ударения
µ &micro; \00B5 Микро
&para; \00B6 Знак абзаца
· &middot; \00B7 Знак умножения
¿ &iquest; \00BF Перевернутый вопросительный знак
ƒ &fnof; \0192 Знак флорина
&trade; \2122 Знак торговой марки
&bull; \2022 Маркер списка
&hellip; \2026 Многоточие
&oline; \203E Надчеркивание
&ndash; \2013 Среднее тире
&mdash; \2014 Длинное тире
&permil; \2030 Промилле
} &#125; \007D Правая фигурная скобка
{ &#123; \007B Левая фигурная скобка
&cong; \2245 Конгруэнтность (геометрическое равенство)
&asymp; \2248 Почти равно
= &#61; \003D Знак равенства
&ne; \2260 Знак неравенства
&ge; \2265 Больше чем или равно
&le; \2264 Меньше чем или равно
&ang; \2220 Угол
&perp; \22A5 Перпендикулярно (кнопка вверх)
&radic; \221A Квадратный корень
÷ &divide; \00F7 Знак деления
&sum; \2211 N-ичное суммирование
&int; \222B Интеграл
[ &#91; \005B Левая квадратная скобка
] &#93; \005D Правая квадратная скобка
&#8251; \203B Знак сноски
&infin; \221E Знак бесконечности

Символы знаков Зодиака

Внешний вид HTML-CODE CSS-CODE Описание
&#9800; \2648 Овен
&#9801; \2649 Телец
&#9802; \264A Близнецы
&#9803; \264B Рак
&#9804; \264C Лев
&#9805; \264D Дева
&#9806; \264E Весы
&#9807; \264F Скорпион
&#9808; \2650 Стрелец
&#9809; \2651 Козерог
&#9810; \2652 Водолей
&#9811; \2653 Рыбы

Карточные символы

Внешний вид HTML-CODE CSS-CODE Описание
&clubs; \2663 "Трефы"
&#9831; \2667 Контур "Трефы"
&hearts; \2665 "Червы"
&#9825; \2661 Контур "Червы"
&diams; \2666 "Бубны"
&#9826; \2662 Контур "Бубны"
&spades; \2660 "Пики"
&#9828; \2664 Контур "Пики"
🂡 &#127137; \1F0A1 Туз пик
🂱 &#127153; \1F0B1 Туз червей
🃁 &#127169; \1F0C1 Туз бубей
🃑 &#127185; \1F0D1 Туз крестей

Символы валют

Внешний вид HTML-CODE CSS-CODE Описание
&#8381; \20BD Российский рубль
$ &#36; \0024 Доллар
&euro; \20AC Евро
£ &pound; \FFE1 Фунт стерлингов
¢ &cent; \FFE0 Цент
¥ &yen; \00A5 Йена или юань
&#8372; \20B4 Знак гривны
&#22291; \5713 Китайский юань
&#8376; \20B8 Казахстанский тенге
&#8377; \20B9 Индийская рупия
&#8369; \20B1 Песо
&#8355; \20A3 Французский франк

© 2015-2018 Goodweb.me --- Карта сайта --- info@goodweb.me

Наверх