Смекни!
smekni.com

Создания интерактивных WEB - страниц для получения информации в сети Интернет с использованием форм, заполняемых пользователем (стр. 1 из 3)

Министерство образования и науки Украины

Севастопольский национальный технический университет

Кафедра технической кибернетики

ОТЧЕТ

по контрольной работе

создания интерактивных WEB - страниц для получения информации в сети Интернет с использованием форм, заполняемых пользователем.

Выполнил: студент гр. А-41з

Брусинов С. Э.

Проверил: Альчаков В.В.

Севастополь - 2007

1 Цель работы

Изучить возможности создания интерактивных WEB - страниц для получения информации в сети Интернет с использованием форм, заполняемых пользователем.


2 Основные положения

2.1 Кратко о WWW и о гипертексте

INTERNET определяется как глобальная информационная сеть, имеющая доступ практически ко всей совокупности всемирных компьютерных сетей. В INTERNET находят применение различные службы (сервисы), такие как электронная почта, телеконференции, системы поиска и доставки файлов, Всемирная паутина - Word Wide Web, в основе которой лежит идея формирования документа в форме гипертекстовой структуры.

Всемирная паутина - WWW - это средство поддержки системы гипертекста на INTERNET.

Гипертекст представляет собой форму организации документа, текст которого может содержать ссылки к отдельным словам, фразам, рисункам и другим элементам текста, что позволяет получить дополнительную информацию об этих элементах текста. С помощью ссылок отдельные страницы текста связываются между собой, образуя гипертекстовый документ. Таким образом, гипертекстовый документ состоит из набора текстовых фрагментов, графики, выделенных элементов документа и системы связи выделенных элементов с другими документами.

2.2 Тег, контейнер, атрибут

В основе гипертекстового языка лежит понятие тег (tag - метка, ярлык, этикетка, бирка) определяющим инструкцию по форматированию следующего за тегом текстового (или иного) фрагмента документа.

Каждый тег начинается со знака «меньше (<)» заканчивается знаком «больше (>)». Между этими двумя символами находится ключевое слово, указывающее основную функцию тега. Например, ключевое слово IMG в теге <IMG> означает, что тег вставляет изображение в документ. Разнообразие ключевых слов позволяет создавать огромные количества эффектов форматирования.

Многие теги HTML, особенно те, которые обеспечивают специальное форматирование, являются парными. Первый тег в паре активизирует эффект, а второй тег – завершает его действие. Например, тег <I> включает курсив. В конце текста, выделяемого курсивом, ставится тег </I>. Косая черта ( / ) перед ключевым словом означает прерывание эффекта, управляемого этим словом. Первый тег в паре называется открывающим, второй – закрывающим. Парные теги называются контейнерными, потому что они образуют как бы контейнер для форматируемого текста. Например, в HTML-коде, HTML – теги <I> очень важны </I>, теги <I> и </ I> являются контейнерными для текста “очень важны”.

Другие HTML-теги стоят сами по себе и называются одиночными. Они, как правило, являются «одномоментными» инструкциями форматирования, например, вставкой изображения, горизонтальной линии, перевода строки и т.д.

Помимо ключевого слова, имеющегося у каждого тега, некоторые теги содержат атрибуты, модифицирующие его действие. Подбирая значение атрибутов, можно экспериментировать в поисках оптимальной схемы размещения элементов на странице. Например, тег <HR>, который изображает горизонтальную линию, имеет несколько атрибутов, влияющих на внешний вид линии. Так, используя атрибут WIDTH, можно заставить линию дойти до середины строки (width = 50%), а атрибутом SIZE изменять толщину линии (size = 4, значение по умолчанию =1).

2.3 Структура любого HTML- документа

Теги <html> и </html> открывают и соответственно закрывают HTML документ. Теги <head> и </head> отделяют заголовок, где, как правило, записывается служебная информация не читаемая в окне программы просмотра, например, в нашем случае в заголовке документа командами <title> и </title> в верхнем левом углу браузера выводятся слова "пример" . Тело всего документа выделяется тегами <body> и </body>. Между этими тегами, как правило, записывается все то, что будет отображаться при открытии документа. Слово "привет!" отображается при просмотре большими буквами потому, что заключено между тегами <h1> и </h1> эти теги применяются для оформления заголовков в тексте выводимом на экран браузером. В эти тегах Вы можете применять числа от 1 до 6. Основной текст нашего документа "пример HTML - документа" выделен тегами <p> и </p> это теги абзаца. Обычно между этими тегами в программе пишут текст, который затем будет выводиться на экран.

2.4 Виды списков, которые возможно реализовать в HTML- документе

HTML поддерживает три различных типов списков, каждый из которых позволяет красиво организовать большое количество информационных элементов. Для задания списка необходима пара тегов на весь список и по паре на каждый элемент списка Если речь идет об упорядоченных списках, то имеются в виду теги <OL> и < /OL>, если же речь идет о неупорядоченных списках (маркированных), то подразумеваются теги <UL> & < /UL>.

Браузер автоматически нумерует элементы упорядоченного списка, начиная с 1.

Третий тип списков – списки описаний (глоссарии) позволяют перечислять термины, за которыми следуют их определения. Термины заключаются в теги <DT> & < /DT>, а описания (определения) в теги <DD> & < /DD>.

Для определения каждого элемента списка используется открывающийся и закрывающийся теги <LI> & < /LI>.

Например:

<OL>

<LI> Numered list items < /LI>

<LI> List items are idented < /LI>

< /OL>

Тег <OL> имеет два атрибута: Type и Start. Атрибут TYPE устанавливатеся равным 1, А, а, i или I, в зависимости от типа нумерации списка – цифрами, большими или малыми буквами, большими или малыми римскими цифрами.

Атрибут START используется, если нумерация должна начинаться не с единицы.

Например:

< OL TYPE = “A” START = 3 > - значит, нумерация списка будет начинаться с буквы С.

Тег <UL> поддерживает атрибут Type, позволяющий вместо маркировочного символа «кружок» (О), (Type = “dise”), устанавливаемого по умолчанию, задавать маркированный символ «квадрат» (Type = “square”) или «окружность» (Type = “circle”).

Рациональное использование тегов <UL> & <OL> позволяет создавать вложенные друг в друга маркированные и нумерованные списки, а также использование атрибута TYPE тега <OL> позволяет создавать вложенные нумерованные списки с разным типом нумерации (буквы и цифры).

2.5 Использование именованных якорей гиперссылок

Когда пользователь выбирает гиперссылку, браузер загружает документ, на который указывает гипертекст и выводит на экран его начало. В том случае, если документ очень большой пользователю приходится долго его прокручивать, чтобы перейти к нужному месту. Чтобы избежать этого, HTML предоставляет возможность установить именованные якоря (закладки в документе), а гиперссылки будут непосредственно указывать на эти якоря (т.е. будет осуществляться переход по закладке внутри документа).

Для создания точек привязки (установления закладок) в пределах одного документа используется следующий синтаксис:

< A name = «уникальное_имя_закладки»>[тело ссылки]< /A >,

где «уникальное_имя_закладки» - это уникальное имя точки привязки, а «тело_ссылки» - это литерал, отображаемый на экране.

Ниже приведен пример программы, поясняющей механизм расстановки закладок внутри документа.

<HTML>

<HEAD>

<TITLE> Anchors < /TITLE >

< /HEAD>

<BODY>

< A name = “Topic_1”> Topic.1 </A>

Topic 1 stuff

< A name = “Topic_2”> Topic.2 </A>

Topic 2 stuff

< A name = “Topic_3”> Topic.3 </A>

Topic 3 stuff

< /BODY>

< /HTML >

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

Теги, использующиеся для связывания с точками привязки в пределах одного HTML- документа, идентичны тегам создания гиперссылок на внешние документы. Для создания гиперссылки на новый фрагмент используется соединяющий синтаксис:

< A href = [ URL ] # “имя_закладки” > имя_якоря < /A >

, где [URL] – необязательный адрес, «имя_закладки» - название точки привязки в пределах текущего документа, «имя_якоря» - это текст или какое-либо другое содержимое, щелчек по которому будет активизировать гиперссылки.

Именованные якоря полезны при создании оглавления, ссылки которого указывают на различные части документа. Наиболее распространенный метод связывания с точкой внутренней привязки предусматривает использование символа «#» и названия точки привязки без указания URL. В этом случае переход по необходимому адресу осуществляется без повторной загрузки документа.

Пример определения точек привязки и установления гипертекстовых ссылок на эти точки приведен ниже:

<HTML>

<HEAD>

<TITLE> Anchors < /TITLE >

< /HEAD>

<BODY>

Read About < A href = “#Topic_1” > Topic_1 < /A >

Read About < A href = “#Topic_2” > Topic_2 < /A >

Read About < A href = “#Topic_3” > Topic_3 < /A >

<HR>

< A name = “Topic_1”> <HR> Topic 1 < /HR> </A>

Topic 1 stuff

< A name = “Topic_2”> <HR> Topic 2 < /HR> </A>

Topic 2 stuff

< A name = “Topic_3”> <HR> Topic 3 < /HR> </A>

Topic 3 stuff

< /BODY>

< /HTML >

2.6 Графические объекты для гиперссылок в HTML- документе

Чтобы разместить изображение на странице необходимо воспользоваться тегом <IMG>. При работе с этим тегом вставки изображения используется следующий синтаксис:

< IMG SRC = “[URL] имя_файла”>.

Значение атрибута SRC задает «имя_файла» с изображением.

Тег <IMG> включает несколько полезных атрибутов, характеристика которых дана ниже: