Лабораторная работа №1
Знакомство с html
Цель работы: научиться создавать HTML-страницы, определять параметры страницы и форматировать web-страницы.
HTML-документ — это один большой контейнер, который начинается с тега <HTML> и заканчивается тегом </HTML>:
<HTML>Содержание документа</HTML>
Контейнер HTML или гипертекстовый документ состоит из двух других вложенных контейнеров: заголовка документа (HEAD) и тела документа (BODY). Рассмотрим простейший пример классического документа.
<HTML>
<HEAD>
<TITLE>Простейший документ</TITLE>
</HEAD>
<BODY TEXT=#0000ff BGCOLOR=#f0f0f0>
<H1>Пример простого документа</H1>
<HR>
</BODY>
</HTML>
Заголовок HTML-документа является необязательным элементом разметки. В HTML 2.0 предлагалось вообще отказаться от элементов HEAD и BODY. В то время в HTML не было элементов, которые использовались одновременно и в заголовке, и в теле документа. Современная практика HTML-разметки такова, что почти в каждом документе есть HTML-заголовок.
Контейнеры заголовка:
-
TITLE (заглавие документа);
-
BASE (база URL);
-
Isindex (поисковый шаблон);
-
META (метаинформация);
-
LINK (общие ссылки);
-
STYLE (описатели стилей);
-
SCRIPT (скрипты).
Чаще всего применяются элементы TITLE, SCRIPT, STYLE. LINK указывают только при использовании внешних относительно данного документа описателей стилей.
Элемент разметки TITLE служит для именования документа в World Wide Web. Более прозаическое его назначение — именование окна браузера, в котором просматривается документ
<TITLE>название документа</TITLE>
Заголовок не является обязательным контейнером документа. Его можно опустить. Роботы многих поисковых систем используют содержание элемента TITLE для создания поискового образа документа. Слова из TITLE попадают в индекс поисковой системы. Из этих соображений элемент TITLE всегда рекомендуется использовать на страницах Web-узла.
Элемент разметки LINK. Он позволил загружать внешние описатели стилей:
<LINK REL=stylesheet href="../css/style.css"
TYPE="text/css">
В данном случае речь идет о загрузке стилей из файла style.css. При этом стили задаются в нотации W3C, а не JavaScript, что определяется атрибутом TYPE. В сущности, атрибут REL определяет тип гипертекстовой связи, HREF (Нуреrtехt REFerence) указывает адрес документа, идентифицирующего связь, а атрибут TYPE определяет тип содержания этого документа.
Элемент разметки STYLE предназначен для размещения описателей стилей. При этом описание стиля из данного элемента разметки, если оно совпадает по имени класса и/или идентификатору подкласса со стилем, описанным во внешнем файле, заменяет описание стиля из внешнего файла. С точки зрения влияния на весь документ, описатели стилей задают правила отображения контейнеров HTML-документа для всей страницы.
В настоящее время контейнер используется только с одним атрибутом TYPE, который задает тип описателя стиля. Это может быть либо text/css , либо text/javascript. Если элемент разметки открыт тегом начала, то он должен быть закрыт тегом конца. В общем виде запись элемента STYLE выглядит так:
<STYLE TYPE=тип_описания_стилей>
описание стиля/стилей
</STYLE>
Элемент разметки SCRIPT служит для размещения кода JavaScript, VBScript или JScript. Вообще говоря, SCRIPT можно использовать не только в заголовке документа, но и в его теле. В отличие от контейнера STYLE, ему не требуется дополнительный контейнер LINK для загрузки внешних файлов кодов. Это можно сделать непосредственно в самом контейнере SCRIPT:
<SCRIPT LANGUAGE="JavaScript"
SRC=script.code>
Если открыт тег начала, то нужно обязательно использовать тег конца контейнера. В противном случае, браузер может отобразить только символ "]". Если код не помещен в HTML-комментарии, то старые версии браузеров (до Mozilla 2) отображают программу перед текстом страницы. В ряде случаев страница вообще может не отображаться.
В общем виде запись контейнера выглядит следующим образом:
<SCRIPT [TYPE=тип_языка_программирования]
[SRC=URL]>
JavaScript/VBScript-код
</SCRIPT>
Существует несколько скриптовых языков: JavaScript, VBScript, JScript. По умолчанию подразумевается JavaScript.