На этом уроке мы познакомимся с HTML-кодом и разберемся с множеством непонятных знаков (синтаксисом гипертекстовой разметки). Для этого нам необходимо создать какой-нибудь не сложный HTML-документ на примере которого мы и будем разбирать этот синтаксис.

Большинство HTML-редакторов в том числе и Dreamweaver позволяют работать как в режиме визуального редактирования так и в режиме непосредственной правки HTML-кода. Мы переключимся в промежуточный режим, когда виден документ и соответствующий ему документ, так нам будет удобнее разобраться, что где находится. Итак перед нами HTML-код в чистом виде. Вглядитесь в него, вы найдёте там фрагменты своего документа, а также массу чужеродных фрагментов заключённых в угловые скобки. Эти фрагменты называются тегами с их помощью производится гипертекстовая разметка. Тег состоит из названия заключённого в угловые скобки.

Название тегов могут писаться как строчными, так и прописными буквами. У тегов есть вторая половина дополненная косой чертой и такие поры окружают текст документа, например заголовок окружён тегом Н1. это называют элементом, элемент и есть часть разметки. Например элемент Н1 помечает текст как заголовок. В браузере такой текст будет отличаться от остального. Давайте попробуем изменить разметку текста, вместо Н1 напишем Р. В панели свойств появляется сообщение что код был изменён и для отображения изменений нужно нажать кнопку refresh F5.

Нажимаем и видим что вместо заголовка получили обычный абзац текста. Итак элемент состоит из открывающих тегов, данных и закрывающих тегов. Назначение тегов обозначение границы элемента. Очень важно, что бы открывающему тегу соответствовал закрывающий. Бывают случаи когда элемент состоит только из открывающего тега, это случается когда элемент, предназначенный для разметки текста несёт самостоятельную нагрузку. Таким элементом является img src, обозначающий вставку изображения.

Элементы могут быть вложенными друг в друга пример элемент img вложен элемент р обозначающий абзац, можно вложить в этот абзац и другие элементы. Например, пометим несколько слов тегом n, эти слова выделились курсивом. Теги не могут пересекаться, вложенный элемент должен закрыться

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

Некоторые теги помимо имени могут включать в себя атрибуты, которые содержат дополнительную информацию о элементе. Атрибут состоит из имен и атрибута и значения разделённого знаком равенства. Например, атрибут img содержит атрибут width отвечающий за ширину изображения. При изменении атрибута ширина картинки изменится. Итак, мы познакомились с основными элементами, из которых состоит HTML-код. В HTML есть свои законы которые находят своё отражение в структуре документа.

⇐Форматирование текста | TeachPro WEB-дизайн | Разметка текста⇒