Неразрывный пробел и другие спецсимволы HTML

Работая в html-редакторе часто появляется необходимость знания спецсимволов (мнемоники) для форматирования текста. Этими символами можно придать тексту правильный вид — легко читаемый и воспринимаемый.

Например, если ваш сайт имеет так называемую резиновую верстку — то расположенный в абзацах текст будет растягиватся по ширине, но при изменении этой ширины некоторые слова перенесутся на новую строку. Таким образом могут автоматически разделится неразрывные словосочетания или названия, например:

…доктор З.
Фрейд, который…

или:

…100

грн. …

У пользователей разные экраны, а значит и ширина «резинового» сайта будет меняться: в каком месте будет перенос — неясно. Даже если ваш сайт заданной ширины, нельзя угадать в каком месте текста закончится строка.  В языке HTML на этот случай существует специальная мнемоника — неразрывный пробел:

Пробел в html прописывается таким вот способом:

То есть, в редакторе должно выглядеть так:

100 грн.

HTML имеет одну особенность — множество пробелов заменяется одним. Если вы поставите 10 пробелов подряд в редакторе — то на странице увидите один. Неразрывный пробел также спасает в этой ситуации, но если вы хотите сделать отступ — лучше использовать для этого CSS.

Иногда нужен обратный эффект — слово слишком длинное и его нужно перенести на новую строку, разделив дефисом. В таком случае поможет мнемоника «мягкого переноса» — &shy:

электрофика&shyция;

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

Таблица основных мнемоник:

 

Имя Код Вид Описание
    неразрывный пробел
£ £ £ фунт стерлингов
€ € знак евро
¶ ¶ символ параграфа
§ § § параграф
© © © знак copyright
® ® ® знак зарегистрированной торговой марки
™ ™ знак торговой марки
° ° ° градус
± ± ± плюс-минус
¼ ¼ ¼ дробь — одна четверть
½ ½ ½ дробь — одна вторая
¾ ¾ ¾ дробь — три четверти
× × × знак умножения
÷ ÷ ÷ знак деления
ƒ ƒ ƒ знак функции
Стрелки
← ← стрелка влево
↑ ↑ стрелка вверх
→ → стрелка вправо
↓ ↓ стрелка вниз
↔ ↔ стрелка влево-вправо
Прочие символы
♠ ♠ знак масти «пики»
♣ ♣ знак масти «трефы»
♥ ♥ знак масти «червы»
♦ ♦ знак масти «бубны»
" " « двойная кавычка
& & & амперсанд
&lt; &#60; < знак «меньше»
&gt; &#62; > знак «больше»
Знаки пунктуации
&hellip; &#8230; многоточие …
&prime; &#8242; одиночный штрих — минуты и футы
&Prime; &#8243; двойной штрих — секунды и дюймы
Общая пунктуация
&ndash; &#8211; тире
&mdash; &#8212; длинное тире
&lsquo; &#8216; левая одиночная кавычка
&rsquo; &#8217; правая одиночная кавычка
&sbquo; &#8218; нижняя одиночная кавычка
&ldquo; &#8220; левая двойная кавычка
&rdquo; &#8221; правая двойная кавычка
&bdquo; &#8222; нижняя двойная кавычка
&laquo; &#171; « левая двойная угловая скобка
&raquo; &#187; » правая двойная угловая скобка

 

Некоторые знаки, такие как амперсанд ( & ) или угловая скобка ( < ), обозначают начало мнемоники или HTML-тегов, так что отображаться не будут. Для вывода их в статье нужно использовать соответствующие спецсимволы.

Читайте также про МЕТА-теги.