p align="left">4. Основные элементы базового языка HTML 4.1 Основные понятия и правила базового языка HTML Язык гипертекстовой разметки HTML - это язык структурной разметки, используемый для создания Web-страниц. Он представляет собой простой набор кодов, называемых элементами, который используется для определения структуры и формата документов. Пользовательская программа, в роли которой обычно выступает Web-браузер, выводит данный документ на экран, интерпретируя значения этих кодов. Базовый HTML - это вид HTML, который используется в большинстве Web-страниц. Элементы в языке HTML состоят из буквенно-цифровых кодов, помещенных в угловые скобки, например <B>, <HTML >, <IMG>, <HR>. Большинство элементов состоят из пары тегов - открывающего и закрывающего. Открывающий тег - это просто мнемонический символ элемента, заключенный в угловые скобки. Например, символ, обозначающий жирный шрифт, - В (от слова Bold - жирный), а его открывающий тег - <B>. Закрывающий тег идентичен открывающему за тем исключением, что перед названием ставится прямая наклонная черта (/). Действие элемента распространяется на всё, что находится между открывающим и закрывающим тегами, например: <B> Этот текст набран жирным шрифтом </B> а этот - нет. В спецификации языка HTML определяется, что именно может окружать каждый из элементов. Это так называемая модель содержимого элемента. Элементы могут окружать другие элементы, текст, комбинацию элементов и текста и могут вообще ничего не окружать. Так, модель содержимого элемента <HEAD>, задающего общую информацию об HTML-документе, позволяет окружать лишь несколько элементов, например <TITLE> и <META>. Модель содержимого элемента <B> позволяет ему окружать текст и некоторые другие элементы, например <I> (курсив), но не такие как <HEAD>. Модель содержимого элемента перевода строки <BR> определяет данный элемент как пустой, так как он не может ничего окружать (тогда элементу не нужен закрывающий тег). Модель содержимого определяет возможные отношения между элементами и содержанием. Если они соблюдаются, HTML-документ считается правильным. Открывающий тег HTML может иметь также несколько атрибутов, которые каким-либо образом меняют его действие. Атрибуты ставятся между угловыми скобками тега и отделяются от названия элемента как минимум одним пробелом. Некоторые атрибуты обозначают действие одним только своим названием, как, например, атрибут COMPACT, добавляемый в элемент упорядоченного списка <OL COMPACT>. Другие атрибуты обозначают действие путём присвоения значения имени. Например, в теге <OL TYPE=”I”> упорядоченному списку присваивается тип нумерации с использованием римских цифр в верхнем регистре. Элемент может содержать несколько атрибутов, они отделяются друг от друга как минимум одним пробелом: <OL COMPACT TYPE=”I”>. Полный элемент HTML определяется открывающим тегом, закрывающим тегом (если таковой имеется), возможными атрибутами и моделью содержимого. На рис. 2.1. показан синтаксис типичного элемента HTML. Имя Имя Значение тега атрибута атрибута <H1 ALIGN = ”LEFT” > Заголовок </H1> атрибут открывающий содержимое закрывающий тег элемента тег элемент HTML рис. 2.1. Типичный элемент HTML Правила языка HTML. При написании HTML-кода необходимо соблюдать следующие правила. · Названия элементов можно писать в любом регистре. Элемент <hTml> обозначает то же самое, что и <html> или <HTML>. Браузер не обращает внимания на то, буквами в каком регистре написаны имена элементов. Тем не менее, следует придерживаться определенного стиля: писать все элементы строчными или заглавными буквами. Практика показывает, что лучше всего названия элементов писать заглавными буквами, тогда HTML-документы легче читать и исправлять. · Значения атрибутов не всегда можно писать в любом регистре. Значение атрибута часто чувствительно к регистру букв, в особенности когда дело касается имён файлов. Имя файла в элементе <IMG SRC=”filename.gif”> не всегда можно заменить на <IMG SRC=”FILENAME.GIF”>. Всё зависит от операционной системы: играет ли для неё какое-либо значение разница в регистре букв. Во избежание недоразумений всегда указывайте в точности то имя, которое было присвоено файлу при сохранении. · Названия элементов не должны содержать пробелов. Броузеры рассматривают первый пробел, встречающийся в элементе, как конец названия элемента и начало его атрибутов. Например, <I M G> не означает <IMG> - тег вставки рисунка. Он будет обозначать <I> - элемент курсива, - с двумя неопределенными атрибутами M и G. · Значения атрибутов могут содержать пробелы, если они помещены в кавычки. Некоторые атрибуты имеют известные значения, как правило, это строки типа LEFT, RIGHT или CENTER. Данные значения не требуется заключать в кавычки. Кавычки используются только в том случае, если внутри значения встречаются пробелы или специфические символы. Например, значения атрибутов SRC и ALT в следующем элементе не содержат пробелов, а потому в кавычки не заключаются. <IMG SRC=dog.gif ALT=Ralf>. Если же значением атрибута надписи к рисунку ALT будет фраза My dog Ralf, она должна быть заключена в кавычки. <IMG SRC=dog.gif ALT=”My dog Ralf”> · Браузеры игнорируют несколько пробелов подряд и сжимают их в один. Браузеры сжимают последовательность из нескольких символов пробела, табуляции или перевода строки в один единственный символ. Эти символы не могут быть использованы для форматирования, если только текст с ними не помещен в специальный элемент <PRE>. Он сохраняет значение каждого символа. · HTML-документы могут содержать комментарии. Язык HTML поддерживает использование комментариев, которые не выводятся броузером на экран. Комментарии начинаются с символов <!- - и заканчиваются символами - -> и могут содержать любое количество строк. Между дефисами и восклицательным знаком не должно быть пробелов. Комментарии могут располагаться в любой части страницы. В особенности они ценны в заголовке документа, так как помогают работать с ним. Комментарий, размещенный в заголовке, может содержать информацию о назначении документа, о его создателе, о требуемых ресурсах и истории внесенных изменений. · Элемент, включающий в себя открывающий тег другого элемента, должен также включать и закрывающий тег этого элемента. Пары тегов разных элементов должны вкладываться друг в друга, а их закрывающие теги не должны пересекаться. Для того, чтобы выделить текст жирным шрифтом и курсивом, набирайте <B><I>Правильно</I></B>, а не <B><I>Неправильно</B></I>. 4.2 Структура HTML-документов Вне зависимости от содержания все правильно составленные HTML -документы имеют одну и ту же структуру. Ниже представлен шаблон HTML-документа: <!DOCTYPE HTML PUBLIC “html версия”> <HTML> <HEAD> <TITLE> Название документа </ TITLE> . . . Здесь указывается прочая дополнительная информация . . . </HEAD> <BODY> . . . Здесь находится размеченный текст . . . </BODY> </HTML> Любой HTML-документ начинается в элемента <!DOCTYPE>, который указывает на версию HTML, в кoторой написан данный документ. После него идет элемент <HTML>, в который и помещается сам документ. Он состоит из двух главных разделов - заголовка (элемент<HEAD>) и тела (элемент <BODY>). В заголовке содержится вся информация, описывающая документ. В нём обязательно должно быть название документа, которое помещается в элемент <TITLE>. В теле же располагается сам текст документа. Из языка SGML язык HTML унаследовал требование, что все документы должны начинаться с элемента <!DOCTYPE>. В HTML-документе с его помощью указывается диалект, использованный для написания документа. Это указание делается в виде ссылки на существующее описание типа документа (document type definition - DTD). В нём записано, какие элементы, атрибуты и отношения между ними должны существовать в документе. Элемент <!DOCTYPE> позволяет программам-валидаторам определить, по какому стандарту языка надо проверять данный HTML-документ. Элемент <HTML> определяет начало и конец HTML-документа. Он содержит только два элемента - <HEAD> и <BODY>. Элемент <HEAD> необязателен. Стандарт HTML 3.2 вообще не требует его использования, также как и все популярные браузеры. Однако, включив его, вы делаете документ более читаемым. 4.3 Раздел заголовка документа (элемент<HEAD>) Элемент <HEAD> включает в себя ту часть документа, в которой содержится описание его характеристик и прочая дополнительная информация. Браузеры не выводят эту информацию, хотя она и используется таблицами стилей и сценариями. Сам элемент <HEAD> в документ вставлять необязательно, так как границы его действия можно отследить и без его задания. Тем не менее, в целях хорошего стиля и читаемости исходного кода включать его всё-таки следует. В соответствии с описанием стандарта HTML 4.0 в элементе <HEAD> могут находиться следующие элементы: <BASE>, <ISINDEX>, <LINK>, <META>, <OBJECT>, <SCRIPT>, <STYLE> и <TITLE>. Элемент <TITLE> должен всегда присутствовать в документе. Ниже приведено краткое описание каждого элемента. Элемент <BASE> указывает абсолютный адрес URL. Cервер и каталог, указанные в данном элементе, добавляются к неполному адресу URL, используемому в документе, чтобы определить путь к нужной странице. Неполный адрес URL иногда называют относительной ссылкой. Элемент <ISINDEX> указывает, что данный документ содержит индекс ключевых слов. Обнаружив этот элемент, браузер выводит окно запроса, в котором находится искомое слово. Сегодня этот элемент редко используется, так как его большей частью заменили формы. Элемент <LINK> определяет связи между данным документом и другими документами. Во-первых, данный элемент может применяться для перемещения между гипертекстовыми документами, а во-вторых, для привязки к документу списка стилей. Элемент <META> с помощью пары «имя - значение» определяет метаинформацию о документе. Часто с помощью <META> определяется информация, описывающая документ, которая затем используется поисковыми службами Web. Существует и другое применение данного элемента: с его помощью можно определять заголовок HTТР-запроса, так что через определенное время вместо текущей страницы будет загружена другая. Элемент <OBJECT> определяет объект, который включается в HTML-документ. Элемент <SCRIPT> позволяет вставлять прямо в Web-страницы программы, написанные на языке сценариев, для выполнения на компьютере-клиенте. Наиболее популярными языками сценариев являются JavaScript и VBScript (вариант Visual Basic). Этот способ увеличения интерактивности страницы называется программированием на стороне клиента. В элемент <STYLE> включаются определения стилей, имеющихся шрифтов, цветов, размещения и прочих аспектов оформления страницы. Стили можно связывать с определенными элементами документа. Элемент <TITLE> должен быть в любом HTML-документе. Он присваивает HTML-документу название, по которому его распознает браузер и роботы поисковых серверов. Браузеры выводят название документа при просмотре, а также используют его при создании закладок. В названии документа можно использовать обычный текст, а также некоторые символьные примитивы (например, ©). Использование разметки в элементе названия не допускается. Название пользователь видит в списке закладок, если он сделал закладку на данную страницу. Роботы поисковых серверов при определении тематики страницы уделяют особое внимание её элементу <TITLE>. Именно поэтому название должно недвусмысленно описывать содержание страницы. В документе может быть только один элемент <TITLE>. Он должен располагаться в заголовке документа. 4.4 Элемент <BODY>(тело документа) Тело документа заключается между тегами <BODY> и .</BODY>. Спецификация HTML 4.0 и большинство браузеров не требует обязательного наличия этого элемента. Но его следует использовать. В документе может быть только один элемент <BODY>. Атрибуты тега <BODY>: background=”1.jpg”____________фоновой узор bgcolor=”gray”________________цвет фона marginwidth=20_______________отступ слева (Netscape) marginheight=0_______________отступ сверху (Netscape) leftmargin=20_________________отступ слева (Internet Explorer) topmargin=0__________________отступ сверху (Internet Explorer) link=”blue”___________________цвет непосещенных ссылок alink=”yellow”________________цвет активных ссылок
Страницы: 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11
|