Спецсимволы в HTML. Как использовать знаки, отсутствующие на клавиатуре?

спецсимволы в html. как использовать знаки, отсутствующие на клавиатуре?

Для чего нужны спецсимволы

Клавиатура это стандартное устройство ввода символьной информации. Количество доступных клавиш на ней ограничено. Тем не менее, одна клавиша соответствует различным символам за счет изменения раскладки через Shift + Alt или ввода с зажатым Shift.

Общий объем существующих символов в сотни раз превышает возможности ввода с клавиатуры. Более того некоторые из них могут не поддерживаться кодировкой документа (Windows-1251, UTF-8 и т.д). Для решения этих проблем в HTML есть альтернативный инструмент.

Специальный символ — это управляющая конструкция, состоящая из амперсанда «&», следующего за ним кода символа, и заканчивающаяся точкой с запятой «;». При выводе в браузер конструкция будет заменена всего одним знаком. Таким образом, можно осуществить показ символа, отсутствующего на клавиатуре.

Существует ещё одна особенность, связанная с обработкой спецсимволов. Формирование тэгов в HTML происходит с помощью левых и правых угловых скобок. Например, блочный контейнер общего назначения записывается как <div>содержимое</div>. Браузер скроет теги, а пользователь увидит лишь слово «содержимое».

Если вы хотите показать угловые скобки как обычный текст, нужно использовать специальные символы &lsaquo; (левая скобка) и &rsaquo; (правая скобка). Браузер не будет считать их за определение HTML-элемента. Запись, приведенного выше куска разметки с помощью кодов спецсимволов, позволит пользователю увидить строку целиком.

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Пример использования специальных символов</title>
    </head>
    <body>
        &lsaquo;h1&rsaquo;Извлечение квадратного корня&lsaquo;/h1&rsaquo;
        <br>
        &lsaquo;p&rsaquo;
        Записываем её с помощью спецсимволов &radic;4&times;4
        &lsaquo;/p&rsaquo;
    </body>
</html>

Заметка
Специальные символы имеют числовую и мнемоническую запись. Они совершенно равнозначны по смыслу и отличаются лишь частью, лежащей между открывающим амперсандом «&» и закрывающей точкой с запятой «;». Далее мы приводим таблицы наиболее распространенных спецсимволов. В них указываются как числовые записи, так и мнемоники, но некоторые знаки имеют только одну форму записи.

Знаки пунктуации

Отображение Числовая запись Мнемоническая запись Описание
  &#160; &nbsp; Неразрывный пробел
&#8194; &ensp; Обычный пробел
&#8195; &emsp; Двойной пробел
&#133; &hellip; Многоточие
&#145; &lsquo; Левая одинарная кавычка
&#146; &rsquo; Правая одинарная кавычка
&#130; &sbquo; Нижняя одиночная кавычка
&#147; &ldquo; Двойная левая кавычка
&#148; &rdquo; Двойная правая кавычка
&#132; &bdquo; Двойная нижняя кавычка
« &#171; &laquo; Двойная левая угловая кавычка
» &#187; &raquo; Двойная правая угловая кавычка
&#8249; &lsaquo; Левая угловая скобка
&#8250; &rsaquo; Правая угловая скобка
§ &#182; &para; Знак абзаца
&#167; &sect; Знак параграфа

Знаки валют и авторского права

Отображение Числовая запись Мнемоническая запись Описание
© &#169; &copy; Знак копирайта
® &#174; &reg; Знак регистрации
&#153; &trade; Товарный знак
¤ &#164; &curren; Определение валюты
&#128; &euro; Евро
$ &#36; - Доллар
¢ &#162; &cent; Цент
¥ &#165; &yen; Иена
£ &#163; &pound Фунт
&#8372; - Гривна
&#8376; - Тенге
&#8381; - Рубль

Математические символы

Отображение Числовая запись Мнемоническая запись Описание
< &#60; &lt; Меньше чем
> &#62; &gt; Больше чем
&#8804; &le; Меньше или равно
&#8805; &ge; Больше или равно
&#8834; &sub; Подмножество
&#8835; &sup; Надможество
&#8836; &nsub; Не подмножество
&#8838; &sube; Подмножество либо равно
&#8839; &supe; Надмножество либо равно
&#8853; &oplus; Прямая сумма
&#8855; &otimes; Тензерное произведение
&#8869; &perp; Перпендикуляр
&#8901; &sdot; Точка
&#8801; &equiv; Идентичность
&#8800; &ne; Неравенство
&#8776; &asymp; Приблезительно
&#8773; &cong; Сравнительно
&#8764; &sim; Подобно
&#8756; &there4; Поэтому
&#8747; &int; Интеграл
&#8746; &cup; Объединение
&#8745; &cap; Пересечение
&#8744; &or; Или
&#8743; &and; И
&#8736; &ang; Угол
&#8734; &infin; Бесконечность
&#8730; &radic; Квадратный корень
× &#215; &times; Умножение
&#8722; &minus; Минус
&#8721; &sum; Сумма
&#8719; &prod; Произведение
&#8715; &ni; Или
&#8713; &notin; Не принадлежит множеству
&#8712; &isin; Принадлежит множеству
° &#176; &deg; Градус
÷ &#247; &divide; Деление
± &#177; &plusmn; Плюс-минус
½ &#189; &frac12; Одна вторая
¼ &#188; &frac14; Одна четвертая
¾ &#190; &frac34; Три четверти
¹ &#185; &sup1; Степень единицы
² &#178; &sup2; Степень двойки
³ &#179; &sup3; Степень тройки

Указатели и пиктограммы

Отображение Числовая запись Мнемоническая запись
&#8592; &larr;
&#8593; &uarr;
&#8594; &rarr;
&#8595; &darr;
&#8596; &harr;
&#8656; &lArr;
&#8657; &uArr;
&#8658; &rArr;
&#8659; &dArr;
&#8660; &hArr;
&#9742; -
&#9743; -
&#9990; -
&#9988; -
&#9993; -
&#9992; -
&#10003; -
&#10004; -
&#10005; -
&#10006; -
&#9762; -
&#9763; -
&#9775; -
&#9774; -
&#9997; -
&#9996; -
&#9789; -
&#9790; -
&#9832; -

Заметка
Мы привели лишь малую часть спецсимволов, доступных в HTML. Урок не ставит перед собой целей перечисления всего множества.

Последние публикации