Знакомство с HTML. Знакомство с html язык гипертекстовой разметки
 Скачать 0.59 Mb.
|
|
1 Знакомство с HTML Язык гипертекстовой разметки HTML (англ. HyperText Markup Language) - является языком разметки документов во Всемирной паутине. В настоящий момент актуальной является версия HTML5. Хронология версий HTML: Версия HTML HTML 2.0 HTML 3.2 HTML 4.01 XHTML HTML 5 Год 1991 1995 1997 1999 2000 2014 HTML является языком разметки , а не программирования, как многие ошибочно полагают. Его основная задача создать каркас для описания различных компонентов документа, таких как абзацы, заголовки, списки, таблицы, ссылки на другие страницы и так далее. HTML документы описываются специальными именами HTML элементов ( тегами ), каждый тег описывает различное содержание документа. Теги представляют собой команды, которые сообщают браузеру, каким образом отображать веб-страницу (документ). Цель любого веб-браузера прочитать HTML документ и правильно его отобразить. Браузер не отображает HTML теги, но использует их, чтобы определить, как отображать конкретный документ. Теги бывают двух видов: парные и одиночные (пустые). У парных HTML- тегов первый тег в паре является начальным (открывающим) тегом, а второй тег является конечным (закрывающим) тегом. Основная функция начального тега заключается в том, чтобы сообщить браузеру где команда начинается, а конечным тегом определить где она заканчивается. Давайте рассмотрим чем отличаются парные теги от одиночных. Синтаксис парного тега ( контейнера ): <тег> Содержание тега Обратите внимание, что все теги заключены в угловые скобки < и > , а закрывающий тег всегда должен содержать прямой слеш перед названием тега - , этим мы сообщаем браузеру, что на этом месте наша "команда" закончена. 2 Допускается вкладывать в контейнер другие теги, однако следует соблюдать их порядок. Так, на рис. демонстрируется, как можно и нельзя добавлять один контейнер внутрь другого. Если связать открывающий и закрывающий тег между собой скобкой, как показано на рис., то несколько скобок обозначающих разные контейнеры, не должны пересекаться между собой (а). Любое пересечение условных скобок (б) говорит о том, что правильная последовательность тегов нарушена. Большинство ошибок в верстке (создание структуры HTML кода) у Вас может возникать по той причине, что не указан закрывающий тег или он указан без прямого слеша / или нарушена вложенность контейнеров. Если не указать прямой слеш, то браузер воспринимает тег как открывающий, а не закрывающий. В том случае если вы вообще не указали закрывающий тег, то браузер не узнает где Ваша команда заканчивается, чтобы её остановить, что может привести к серьезным ошибкам, будьте внимательны. Синтаксис одиночного тега: <тег> Содержание Основное отличие одиночных тегов от парных заключается в том, что одиночные теги не требуют закрывающий тег после содержимого элемента. Они добавляют на страницу одиночные объекты, например, изображение, или производят какое-то одиночное действие, например, такое как перевод строки. У тегов допустимы различные атрибуты , которые разделяются между собой пробелом. Впрочем, есть теги без всяких дополнительных атрибутов. Условно атрибуты можно подразделить на обязательные , они непременно должны присутствовать, и необязательные , их добавление зависит от цели применения тега. 3 Синтаксис написания тега с атрибутами: <тег атрибут1="значение" атрибут2="значение"> или <тег атрибут1="значение" атрибут2="значение">... Правила применения тегов Для тегов любого типа действуют определенные правила их использования. Причем, некоторые правила обязательны для выполнения, а другие являются рекомендациями, т.е. их можно выполнять, а можно и нет. Атрибуты тегов и кавычки Согласно спецификации HTML все значения атрибутов тегов следует указывать в двойных ("пример") или одинарных кавычках ('пример'). Отсутствие кавычек не приведет к ошибкам, браузеры во многих случаях достаточно корректно обрабатывают код и без кавычек, за исключением текста, содержащего пробелы В данном примере строка 7 написана правильно, со всеми кавычками, а в строке 8 у атрибута alt кавычки отсутствуют. Из-за этого браузер в качестве значения alt возьмет только первое слово («Вид»), а слово «заголовка» будет воспринято как ошибочное значение. Поэтому всегда приучайтесь указывать значения атрибутов тегов в кавычках. Теги можно писать как прописными, так и строчными символами Любые теги, а также их атрибуты нечувствительны к регистру, поэтому вы вольны выбирать сами, как писать — , или . В любом случае рекомендуется придерживаться выбранной формы записи на протяжении всех страниц сайта. Заметим также, что текст, полностью набранный прописными символами, читается хуже, чем текст со строчными символами или смешанный. Переносы строк Внутри тега между его атрибутами допустимо ставить перенос строк. На рис. показана одна и та же строка, но оформленная разными способами. 4 Неизвестные теги и атрибуты Если какой-либо тег или его атрибут был написан неверно, то браузер проигнорирует подобный тег и будет отображать текст так, словно тега и не было. Опять же, следует избегать неизвестных тегов, поскольку код HTML не пройдет валидацию. Порядок тегов Существует определенная иерархия вложенности тегов. Например, тег |