Специальные символы HTML — это короткие фрагменты кода, называемые символьными сущностями. Они используются для отображения символов, имеющих в HTML особое значение, а также символов, которые не доступны на клавиатуре.
Специальные символы HTML называются зарезервированными. Например, левые () угловые скобки зарезервированы в HTML для определения открывающих и закрывающих тегов.
Символы, которые не доступны на клавиатуре, включают в себя такие знаки, как символ копирайта (©) и математическое значение пи.
Если мы хотим использовать их в документе и выводить в браузере, нужно использовать ссылки на символы HTML .
Практический примерПредположим, что вы хотите отобразить на веб-странице блок HTML-кода , чтобы при этом выводились теги элементов. Можно сделать это, просто поместив блок HTML в теги . Но вы обнаружите, что даже в , блок все равно будет обрабатываться как HTML-код и отображаться браузером соответствующим образом. В этом случае можно заменить все специальные символы HTML соответствующими символьными ссылками, чтобы браузер не обрабатывал код:
This is a list of items.
- List Item A
- List Item B
- List Item C
Первый абзац.
Второй абзац.
Скопируйте содержимое данного примера и сохраните его в папке c:\www\ под именем example2.html. После этого запустите браузер и откройте файл через пункт меню Файл > Открыть файл (Ctrl+O). В диалоговом окне выбора документа укажите файл example2.html. В браузере откроется веб-страница, показанная на рис. 1.
Рис. 1. Результат примера в браузере
Элемент (жарг. доктайп) предназначен для указания типа текущего документа - DTD (document type definition, описание типа документа). Это необходимо, чтобы браузер понимал, как следует интерпретировать текущую веб-страницу, ведь HTML существует в нескольких версиях - современный HTML5 или устаревшие HTML4 и XHTML. Чтобы браузер «не путался» и понимал, согласно какому стандарту отображать веб-страницу и необходимо в первой строке кода задавать .
Поскольку мы в дальнейшем будем работать только с HTML5, то нам потребуется только один короткий и современный доктайп.
Мы упоминали, что имена элементов можно писать маленькими и большими буквами. К это правило тоже относится и его можно записывать по разному. Тем не менее, традиционно имя этого элемента пишется в верхнем регистре.
Открывающий тег определяет начало HTML-документа, внутри него хранится «голова» ( ) и «тело» документа ( ).
Содержимое этого раздела не показывается напрямую на странице, за исключением элемента . Внутри могут располагаться следующие элементы: , , , , или .
Элемент является универсальным и добавляет целый класс возможностей, в частности, с помощью метатега, как обобщённо называют этот элемент, можно изменить кодировку страницы, добавить ключевые слова, описание документа и многое другое, предназначенное для браузера или поисковых систем. В частности, чтобы браузер понимал, что имеет дело с кодировкой UTF-8 (Unicode transformation format, формат преобразования Юникод) и добавляется данная строка.
Пример веб-страницы
Элемент определяет название веб-страницы. В браузере оно отображается на текущей вкладке (рис. 2).
Рис. 2. Название веб-страниц в браузере
Элемент является обязательным и должен непременно присутствовать в коде документа. Внутри разрешается писать только текст и никаких других элементов в быть не должно. Но допустимо добавлять разные текстовые символы, например, так: Adobe™ Photoshop® .
Закрывающий тег показывает, что «голова» документа завершена.
«Тело» документа предназначено для размещения элементов и содержимого веб-страницы.
Заголовок
HTML предлагает шесть текстовых заголовков разного уровня, которые показывают относительную важность раздела, расположенного после заголовка. Так, элемент представляет собой наиболее важный заголовок первого уровня, а элемент служит для обозначения заголовка шестого уровня и является наименее значительным. По умолчанию, заголовок первого уровня отображается самым крупным шрифтом жирного начертания, заголовки последующего уровня по размеру меньше. Элементы ... относятся к блочным элементам, они всегда начинаются с новой строки, а после них другие элементы отображаются на следующей строке. Кроме того, перед заголовком и после него браузер добавляет пустое пространство.
Некоторый текст можно спрятать от показа в браузере, сделав его комментарием. Хотя такой текст пользователь не увидит, он всё равно будет передаваться в документе, так что, посмотрев его исходный код, можно обнаружить скрытые заметки.