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

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

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

str0Специальные символы – это те символы, которые отсутствуют на нашей клавиатуре. К таким символам относятся буквы алфавитов части европейских языков, математические и другие символы. Некоторые символы, введенные в HTML документ будут интерпретироваться не так, как задумал автор. Это, например, символы «<» и «>», используемые для указания тегов.

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

В этой статье мы познакомиться со служебными специальными символами.

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

В качестве примера служебного символа приведем знак “<”: он будет
указывать браузеру на начало элемента разметки (является символом начала
тега), несмотря на то, что в действительности мы попытались записать
неравенство «a < b».

Кроме символа «<«, браузер считает служебными знак «больше» (>),
двойные кавычки («), одинарные кавычки () и амперсанд (&).

Эти символы зарезервированы, и поэтому могут не отображаться при просмотре HTML-документа.

Если вставить их в HTML-код так, как они есть, браузер нередко начинает путаться.

Во избежание подобных случаев была разработана так называемая «именная замена«. Она позволяет записать в код некоторые символы, зарезервированные программой как служебные, следующим образом:

амперсанд (&)+ именная замена + точка с запятой (;)

Если вы воспользуетесь этой формулой, то браузер отобразит выбранный
нами символ корректно.

К примеру, левую угловую скобку (<) мы можем записать как «&lt;«,
правую (>) – «&gt;«, где «lt» и «gt» – именные замены для левой и правой скобок соответственно.

Можно посмотреть таблицу часто используемых символов.
В этой таблице указаны символы, их названия, два кода – в десяти- и шестнадцатеричной системе, и, конечно, именная замена.

Этот способ можно применить для отображения всех часто используемых символов: знака копирайта (©), знака зарегистрированной торговой марки (®), неразрывного пробела и т.д.

Другие способы вставки специальных символов

Помимо именной замены, в таблице Вы приведены еще несколько способов
вставки специальных символов:

  • Указание его числового кода 10-й системе счисления.
    Записывается он как «&» (амперсанд), «#» (решётка), десятизначный числовой код, «;» (точка с запятой).

Например, для того чтобы вставить знак параграфа (§),  в исходном коде необходимо набрать «&#167;«. Символ будет отображен корректно.

Специальные символы
Десятеричный код символа

 

*Не все символы можно вставить в код этим способом.

  • Альтернативный способ, который позволяет записать абсолютно все символы Unicode, — это указание числового кода символа в
    16-й системе исчисления
    . Запись выглядит следующим образом: «&«
    (амперсанд), «#» (решётка), «x» (латинская «X»), 16-тиричный числовой код, «;» (точка с запятой).

 

Пусть это будет вертикальный разделитель «|«. Для выполнения поставленной задачи набираем в коде HTML-документе «&#x007C» и затем любуемся достигнутым результатом.

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

 

Особенности отображения пробельных символов

Помимо уже перечисленных служебных символов, браузер особым образом обрабатывает пробельные символы, а именно: сокращает последовательно идущие пробелы и переводы строк до одного пробела.

Давайте рассмотрим эту особенность на примере.

Создадим элемент p и напишем в нем произвольный текст (на первой строчке пусть будет текст «обработка пробельных символов«, на второй – символ табуляции и текст «следующая строка«, еще переход, немного отступов и снова текст – «следующая строка с отступом«).

Исходный код

<p>Обработка пробельных символов
следующая строка
следующая строка с отступом</p>

Результат применения

Обработка пробельных символов следующая строка следующая строка с
отступом

Вся последовательность символов – новые строки, пустые строки –сокращены до одного пробела!

Возможно, на первый взгляд алгоритм обработки кажется странным, но на самом деле это очень удобно. Мы получаем возможность делать исходный код структурированным, удобочитаемым и понятным как для нас, так и для посетителей, которым понадобилось просмотреть код HTML-документа.

Кстати, у начинающих разработчиков может возникнуть вопрос: Почему символы? Ведь пробел – это пустое место!

В действительности, это не так. Компьютеру нужно каким-то образом обработать введенный нами текст, и в дальнейшем так же корректно его отобразить. Поэтому пробел, равно как пустая строка или перевод строки, является служебным символом.

Управлять режимом обработки пробельных символов позволяет свойство white-space, а элемент pre запрещает браузеру сокращать пробельные символы.

Типографские символы, отсутствующие на клавиатуре

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

  • Неразрывный пробел.
    Как мы уже говорили, браузер сокращает все пробельные символы до
    одного; в том случае, если слово не умещается на текущей строке, оно
    будет перенесено на следующую строку по символу пробела. Это не
    всегда допустимо: например, такие словосочетания как «Тюменская Нефтяная Компания«,
    «120 км/ч» или «Петр Петрович Петров» разрывать нежелательно. Для того чтобы избежать этого, используют специальный символ «неразрывный пробел«. При этом, если строка с разделенными неразрывным пробелом словами не будет полностью помещаться в окне браузера, браузер увеличит ширину веб-страницы, добавив снизу горизонтальную полосу прокрутки.

Символ неразрывного пробела можно вставить в текст, воспользовавшись
любым удобным способом: именной заменой (&nbsp;), десятичным (&#160;)
или 16-ричным кодом (&#x00A0;). Также допустимо использование сочетания «Alt» + «0160» .

При отображении в браузере, неразрывный пробел не отличается от обычного
пробела.

  • Все вышесказанное справедливо и для неразрывного дефиса. Если
    необходимо запретить перенос слов, то в словосочетаниях вместо дефиса используют неразрывный дефис. Его можно вставить с помощью 16-ричного символьного кода «&#x2011;«
  • Мягкий перенос.
    Его ставят в тех местах, где допустим перенос слова. В текстовом
    редакторе он выглядит точно так же, как «обычный дефис», но в
    отличие от него, в рабочей области браузера не отображается. Зато в
    случае, когда слово в конце строки не помещается в нее полностью, то
    на следующую строку переносится часть слова после символа «мягкого
    переноса
    «, а его знак становится видимым.

Обозначается мягкий перенос 16-ричным&#x00AD;) или десятичным (­&#173;) кодом, именной заменой (­&shy;), сочетанием клавиш «Alt«+»0173«.

Теперь о грустном. Попробуйте представить, сколько сил и времени понадобится для расстановки символов мягкого переноса на странице с
большим объемом текста. Мы ни разу не видели сайты, на которых возможности мягкого переноса были бы реализованы.

Автоматическая расстановка мягких переносов, к сожалению, пока еще не
придумана.

  • Знак ударения.
    Для того чтобы в слове появился «знак ударения» (&#x0301;),
    его 16-ричный код вставляют после ударной буквы. Результат не
    всегда выглядит красиво, поэтому перед использованием символьного
    кода на сайте просмотрите, как он отображается во всех браузерах

Пример: язы́к разме́тки гиперте́кста

В качестве альтернативы можно воспользоваться символами латинских букв, с
уже проставленными ударениями, но будьте готовы к тому, что поисковые
системы не оценят ваши старания.

Посмотрите видео о применении специальных символов для создания страниц в html:

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *