HyperText Markup Language (HTML) – язык разметки гипертекста – предназначен для написания электронных документов, публикуемых в WorldWideWeb. Гипертекстовый документ – это текстовый файл, имеющий специальные метки, называемые тэгами, которые впоследствии опознаются браузером и используются им для отображения содержимого файла на экране компьютера.
Поскольку HTML-документы записываются в ASCII-формате, то для их создания может быть использован любой текстовый редактор. Обычно HTML-документ – это файл с расширением .html или .htm
Язык HTML состоит из тэгов (от английского слова tag – ярлык, признак) – символов, которые управляют отображением текста и при этом сами не отображаются на экране.
Все тэги языка HTML выделяются символами-ограничителями (< и >), между которыми записывается идентификатор (имя) тэга и, возможно, его параметры. Названия тэгов, а также их параметров можно записывать на любом регистре.
Теги определяют, в каком виде будет представлен текст, какие его компоненты будут исполнять роль гипертекстовых ссылок, какие графические или мультимедийные объекты должны быть включены в документ. Графическая и звуковая информация, включаемая в HTML-документ, хранится в отдельных файлах.
Большинство тэгов HTML используется попарно, то есть для оределенного открывающеготэга в документе имеется соответствующий закрывающий тэг. Тэги можно вводить в любом регистре. По правилам HTML, закрывающий тэг записывается так же, как и открывающий, но с символом / (прямой слэш) перед именем тэга. Единственным различием парных тэгов является то, что закрывающие тэги не используют параметры. Действие любого парного тэга начинается с того места, где встретился открывающий тэг и заканчивается при встрече соответствующего закрывающего тэга. Например:
<B> Текст </B>
Текст, заключенный между <B> и </B>, будет отображаться жирным шрифтом.
Тэги, которые нуждаются в соответствующих завершающих тэгах, называются тэгами-контейнерами. Все, что записано между соответствующим открывающим и закрывающим тэгом, называются содержимым, или элементом тэга-контейнера.
Есть ряд тэгов, для которых завершающие тэги можно не указывать, например, тэг элемента списка <LI> или тэг абзаца <P>. Ряд тэгов в принципе не нуждается в закрывающих тэгах. Примерами могут служить тэг вставки изображений <IMG>, принудительного перевода строки <BR>.
Тэги могут записываться с параметрами или атрибутами.
<имя_тэга [атрибуты]>
…..
</имя_тэга>
Прямые скобки, используемые в описании синтаксиса, означают, что данный элемент может отсутствовать.
Атрибуты (параметры) тэга отделяются друг от друга пробелами. Порядок следования параметров тэга произволен. Для некоторых атрибутов значение может не указываться. Если параметр требует значения, то оно указывается после названия параметра через знак равенства. Значение параметра может записываться как в кавычках, так и без них. Если в значении параметра имеются пробелы (например, оно состоит из нескольких слов), без кавычек не обойтись.
Атрибуты тэга записываются в следующем формате:
имя [="значение"].
Например:<TABLE BORDER ALIGN = "left">.
Здесь для тэга <TABLE> задано два параметра. Первый параметр BORDER указан без значения. Второй параметр ALIGN имеет значение left.
HTML-документ – это один большой контейнер, который начинается с тэга <HTML> и заканчивается тэгом </HTML>. Эти тэги обозначают, что находящиеся между ними строки представляют единый гипертекстовый документ. Без этих тэгов браузер или другая программа просмотра не в состоянии идентифицировать формат документа и правильно его интерпретировать.
Контейнер HTML состоит из двух других вложенных контейнеров: заголовка документа (HEAD) и тела документа (BODY).
<HTML>
<HEAD>
...
</HEAD>
<BODY>
...
</BODY>
</HTML>
Чаще всего в заголовок документа включают парный тэг<TITLE> ... </TITLE>. То, что находится между этими двумя тэгами, многие браузеры используют как заголовок окна, в котором выводят документ. Заголовок не является обязательным контейнером документа.
В контейнере заголовка также могут быть размещены другие тэги. Например: элемент разметки STYLE предназначен для размещения описателей стилей; элемент META позволяет также хранить списки ключевых слов и описания документа, которые будут использоваться для составления индекса поисковой системы.
Все, что находится между тэгами <BODY> и </BODY>, будет отображаться на самой странице. С помощью атрибутов тэга <BODY>задается цвет фона, текста, ссылки и многое другое. Например: BGCOLOR – определяет цвет фона документа, BACKGROUND – указывает на URL-адрес изображения, которое используется в качестве фонового.
В HTML определены 6 уровней заголовка, нумеруемых по убыванию важности от Н1 до Н6. Текст, окруженный тэгами <Н1></Н1>, получается большим – это основной заголовок. Если текст окружен тэгами <Н2></Н2>, то он выглядит несколько меньшим (подзаголовок) и так далее до <Н6></Н6>.
Для разделения текста на абзацы используется тэг <P>. При этом нет отступа красной строки, а происходит вставка пустой строки. С тэгом <P> можно использовать те же атрибуты, что и в тэгах заголовков.
Атрибут АLIGN позволяет выравнять текст по левому или правому краю, по центру или ширине. Данный атрибут применим также к линиям, графике и таблицам.
АLIGN = justify выравнивание по ширине.
АLIGN = left выравнивание по левому краю. Поскольку выравнивание по левому краю задается по умолчанию, этот атрибут можно опустить.
АLIGN = right выравнивание по правому краю.
АLIGN = center центрирование текста и графики.
Тэг <BR> используется для перевода строки. От абзаца он отличается тем, что он переводит текст на одну строку вниз.
Для запрета перевода строки его заключают между тэгами <NOBR> и </NOBR>. Текст между ними будет гарантированно располагаться в одной строке без переноса на другую.
Другим методом разделения документа на части является проведение горизонтальных линий. Тэг <HR> позволяет провести горизонтальную линию в окне большинства программ просмотра. Этот тэг не требует закрывающего тэга. До и после линии автоматически вставляется пустая строка. Тэг <HR> может содержать следующие атрибуты: SIZE – определяет толщину линии; WIDTH – определяет размер линии по ширине экрана; COLOR – указывает цвет линии.
Язык HTML поддерживает физический и логический стили форматирования содержимого документа. В первом случае используются тэги, однозначно определяющие определенное начертание шрифта; во втором автор странички не может заранее сказать, каким образом будет отображаться информация, выделенная этими стилями (это остается на рассмотрение браузера). Разные браузеры один и тот же стиль отображают по-разному.
Физическое форматирование.
Текст, расположенный между тэгами <ВIG></ВIG> или <SMALL></SMALL>, будет, соответственно, больше или меньше стандартного.
С помощью тэгов <SUP></SUP>и <SUB></SUB>можно задавать верхние и нижние индексы.
<B></B> – выделение жирным шрифтом.
<I></I> – выделение наклонным шрифтом.
<TT></TT> – выделение шрифтом, имитирующим печатную машинку.
Логическое форматирование.
<EM></EM> – акцент.
<STRONG></STRONG> – сильныйакцент.
<CODE></CODE> – отображение исходного кода какой-либо программы.
<CITE></CITE> – цитирование.
<SAMP></SAMP> – "образец", используется для отображения образцов, выводимых на экране программы.
<KBD></KBD> – стиль клавиатуры, используется, когда необходимо указать, что эти данные должны вводиться с клавиатуры.
<VAR></VAR> – "переменная", используется для написания имен переменных.
<Q></Q> – текст, заключенный в двойные кавычки.
Кроме вышеперечисленных тэгов в документе может использоваться тэг <FONT>, позволяющий непосредственно задать размер и цвет шрифта. Атрибут SIZE служит для указания размера шрифта в условных единицах от 1 до 7. SIZE указывает pазмеp шрифта – абсолютный, в виде числа без знака, либо пpиpащение по отношению к базовому pазмеpу (обычно выбираемому пользователем бpаузеpа), в виде числа со знаком. Атрибут COLOR устанавливает цвет шрифта. Атрибут FACE позволяет указать тип шрифта. Например:
<FONTCOLOR = #008888 SIZE = +2 Face = Аria>
текст
</FONT>
В HTML-документ можно включать комментарии, позволяющие скрыть часть текста от браузера. Все, что заключено между последовательностями символов <!- и ->, при просмотре страницы остается невидимым.
В настоящее время стандарты HTML поддерживают тэги для списков трех различных видов: нумерованных (упорядоченных), маркированных (неупорядоченных) и списков определений.
Весь нумерованный список заключается между парой тэгов <OL> и </OL>, а каждый элемент списка расположен между тэгами <LI> и </LI>. Тэг <OL> может имеет атрибуты TYPE и START. Атрибут TYPE задает вид счетчика: значение А – большие латинские буквы, значение 1 – арабские цифры (эта нумерация пользуется по умол-чанию), a START – начальное значение.
Маркированный список начинается стартовым тэгом <UL> и завершается тэгом </UL>. Каждый элемент списка начинается с тэга <LI> и завершается (необязательным) тэгом </LI>.
Тэг <UL> имеет атрибут TYPE, определяющий внешний вид маркера. Значение атрибута TYPE может быть одним из следующих: disc (круг – форма по умолчанию), circle (окружность) или square (квадрат).
Список описаний (список определений) начинается с тэга <DL> и завершается тэгом </DL>. Каждый термин обозначается тэгом <DT>, а его описание – тэгом <DD>. Эти тэги являются непарными и задают сдвиг текста в определенном направлении: термин автоматически размещается у левой границы страницы, а их определения смещены относительно них вправо.
Таблицы являются наиболее простым способом размещения информации. Они могут быть вложенными. Определяется таблица с помощью следующих тэгов:
<TABLE></TABLE> – задает таблицу;
<CAPTION></CAPTION> – определяет заголовок таблицы;
Заполнение таблицы происходит построчно; для обозначения строки используется пара тэгов <TR>...</TR>. Строка состоит из ячеек, для задания которых используют либо тэги <TH>...</TH>, если эти ячейки содержат заголовки столбцов, либо тэги <TD>...</TD> – для данных. Заголовки выводятся полужирным шрифтом и располагаются по центру ячейки. Данные имеют обычный шрифт и выравниваются по левой стороне ячейки.
Тэг <TABLE> может иметь следующие атрибуты: align –указывает для текущей таблицы, каким образом при разметке осуществляется ее горизонтальное выравнивание; width –определяет ширину таблицы; border – позволяет задавать для таблицы ширину внешней рамки. Элемент <CAPTION> может иметь только один атрибут – ALIGN, который может принимать два значения: ALIGN = TOP или ALIGN = BOTTOM. Посредством этого атрибута можно выбирать, помещать ли заголовок над таблицей или, соответственно, под ней.
Для соединения двух смежных ячеек в одном столбце нужно использовать атрибут ROWSPAN тэга <TH> или <TD>, например,
<TD ROWSPAN = 2>
Для объединения двух смежных ячеек в одной строке нужно использовать атрибут COLSPAN тех же тэгов, например,
<TD COLSPAN = 2>.
Тэги <TABLE>, <TD>, <TH> и <TR> допускают использование в них атрибутов BGCOLOR и BORDERCOLOR для задания цвета ячейки и цвета рамки ячейки или таблицы.
Основное свойство HTML-файлов – это возможность их связывания между собой. При этом образуются гиперссылки, которые могут связать одну часть текста с другой независимо от ее положения. Гиперссылка имеет следующий общий вид:
<A HREF = " [адрес перехода] "> выделенный текст </A>.
В качестве перехода может быть использовано несколько типов аргумента. Самым простым является другая HTML-страничка:
<A HREF = "index.html">начало</A>.
Часто появляется потребность перейти по странице выше или ниже внутри одного документа. В таком случае ссылка будет состоять из двух частей:
а) <A NAME = "AAA"> переход закончен </A> – для обозначения метки в файле, куда будет осуществлен переход;
б) <A HREF = 2.htm#AAA> переход </A> – для осуществления самого перехода.
Кроме того, можно осуществлять переходы на конкретные файлы, расположенные в Интернете:
<A HREF = "www.server/file.ru"> отрытьфайл </A>
Аналогичным образом можно задать ссылку:
<A HREF = "mailto:user@mail.box"> отправить письмо </A>.
Для вставки на Web-страницу изображение должно иметь определенный формат, который поддерживается браузером. Наиболее часто используются форматы: GIF, JPEG (JPG), BMP.
Команда <IMG SRC = "picture.gif"> позволяет вставить изображение в HTML-документ.
Тэг изображения имеет один обязательный атрибут SRC и необязательные: ALT, ALIGN, USEMAP, HSPACE, VSPACE, BORDER, WIDTH, HEIGHT.
Атрибут ALT определяет комментарий к данному изображению, который будет выводиться вместо изображения браузерами, неспособными представлять графику.
Изображения на Web-странице могут использоваться в качестве гипертекстовых ссылок, как и обычный текст.
<A HREF = "адрес изображения"><IMG SRC = "picture.gif"></A>.
Фрэймы позволяют разбивать Web-страницы на множественные подокна. Фрэймы обладаютследующими свойства:
Каждый имеет свой URL, что позволяет загружать его независимо от других фрэймов.
Каждый фрэйм имеет собственое имя (параметр NAME), позволяющее переходить к нему из другогофрэйма
Размер фрэйма может быть изменен пользователем прямо на экране при помощи мыши (если это не запрещено указанием специального параметра).
В каждом фрейме может отображаться свой HTML-документ.
Каждый фрейм может иметь свои полосы прокрутки, ссылки, графические изображения и т. д.
В документе, содержащем фрэймы вместо тэга BODY, используется контейнер FRAMESET. Общий контейнер FRAMESET описывает все фрэймы, на которые делится экран. Тэг FRAME описывает каждый фрэйм в отдельности.
Тэг <FRAMESET> имеет два главных атрибута: ROWS и COLS, задающих разбиение на строки и столбцы соответственно.
Например, разбиение на три не равные колонки:
<HTML>
<HEAD>...</HEAD>
<FRAMESET COLS =" 50%,20%,* " >
<FRAME SRC = "адресфайла">
<FRAME ...>
...
</FRAMESET>
</HTML>.
| < Предыдущая | Следующая > |
|---|