Если у вас возникли сложности с курсовой, контрольной, дипломной, рефератом, отчетом по практике, научно-исследовательской и любой другой работой - мы готовы помочь.
Предоплата всего
Подписываем
4
ЛАБОРАТОРНАЯ РАБОТА N 14
Создание гипертекста
Цель работы: изучить методику создания HTML-гипертекста
Гиперссылки обеспечивают возможность премещения по гипертексту. Гиперссылки имею следующие особенности:
Имеются следующие типы ссылок: ссылка внутри HTML-страницы, ссылка на другую HTML-страницу, cсылка на фрагмент текста внутри другой HTML-страницы.
Для задания гипертекстового перехода внутри документа используют тег <A> с разными атрибутами. Тег <A> с атрибутом href является ссылкой (можно сравнить с командой перехода типа GOTO), а тег <A> с атрибутом name – приемником (можно сравнить с меткой, на которую выполняется переход по GOTO). Ниже приводится пример внутреннего перехода.
В приведенном выше примере слово здесь будет выделено как гиперссылка. При щелчке мышью по этой гиперссылке браузер перейдет к соответствующей метке, и в окне браузера появится текст Рассмотрим команду более подробно . . . . .
Для организации перехода внутри документа нужно:
Для задания гипертекстового перехода на другую HTML-страницу также используется тег <A>. Для того, чтобы браузер загрузил в свое окно новую HTML-страницу, нужно записать в программе ссылку при помощи тега <A> с атрибутом href=имя_файла. Ниже приводится пример ссылки из HTML-страницы PAGE1.HTM на страницу PAGE2.HTM.
В приведенном выше примере слова приложение 2 будут выделены как гиперссылка. При щелчке мышью по этой гиперссылке, и в окне браузера появится текст из файла PAGE2.HTM. Обратите внимание, что перед именем файла символ # не ставится.
Ссылка на фрагмент текста внутри другой HTML-страницы организуются комбинацией рассмотренных выше способов. Рассмотрим пример.
В приведенном примере гиперссылка см. пункт 1 Приложения 2 ссылается на метку с именем 1 в файле page2.htm.
Если в теге <A> указано имя файла, браузер ищет файл в том же каталоге, в котором расположен файл с гиперссылкой. Когда необходимо сослаться на файл из другого каталога можно использовать абсолютную или относительную ссылку. При использовании абсолютной ссылки в гиперссылке указывается полный путь к файлу, начиная с имени дисковода. При использовании относительной ссылки в гиперссылке указывается путь по отношению к файлу со ссылкой. Использование относительных ссылок позволяет переносить многофайловый гипертекст из одного каталога в другой и с одного компьютера на другой без дополнительных настроек.
Предположим, что гипертекст расположен в файлах с приведенной ниже структурой каталогов. И предположим мы хотим сослаться из файла PAGE1.HTM, расположенного в каталоге 01 на файл PAGE2.HTM, расположенный в каталоге 02.
В этом случае абсолютная ссылка будет выглядеть как С:/BOOK/02/PAGE2.HTM, а относительная ссылка как ../02/PAGE2.HTM. Для ссылки из файла PAGE3.HTM на файл PAGE2.HTM, расположенный в каталоге 02, можно использовать следующие абсолютную и относительную ссылки: С:/BOOK/02/PAGE2.HTM и ./02/PAGE2.HTM.
Обратите внимание что обозначение ../ используются для ссылки на родительский каталог, а обозначение ./ - для ссылки на текущий каталог. Кроме того, обратите внимание на то, что при записи пути к файлу используется косая черта с наклоном вправо, а не влево, как принято в DOS.
В результате выполнения работы вы должны: освоить методику создания HTML-гипертекста.
Запустите текстовый редактор и наберите следующий текст. Сохраните набранный текст в файле Docum3.htm.
<HTML>
<HEAD>
<META content="charset=windows-1251">
<TITLE>Лабораторная работа 14. Гиперссылки</TITLE>
</HEAD>
<BODY>
<H1>Руководство по протоколам Internet</H1>
<H3>Содержание</H3>
<P>
1. Описание протокола <A href=#1>SLIP </A> <!-- Ссылка 1 --> <BR>
2. Описание протокола <A href=#2>PPP </A> <!-- Ссылка 2 --> <BR>
</P>
<H4> Введение </H4>
<P>
Технология Internet, базирующаяся на протоколах TCP/IP поддерживает много различных сред передачи данных . . . . .
</P>
<A name=1> <!-- Первая метка -->
<H4>1. Протокол SLIP</H4>
<P>
Протокол SLIP (Serial Line IP) - Это простейший способ инкапсуляции IP-дейтаграмм для передачи по последовательным каналам связи. Он использовался для подключения домашних компьютеров к сети Internet с помощью телефонного модема.
</P>
<A name=2> <!-- Вторая метка -->
<H4> 2. Протокол PPP </H4>
<P>
Протокол PPP (Point-To-Point) предназначен для решения тех же задач, что и <A href=#1> SLIP</A>, но лишен многих его недостатков.
</P>
</BODY>
</HTML>
Закройте текстовый редактор. Запустите браузер и просмотрите как будет выглядеть набранный вами документ. Обратите внимание как браузер выделяет ссылки. Выполните переход по ссылкам. При этом обратите внимание как изменяется в окне браузера содержимое строки адреса документа.
Посмотрите как работают кнопки Вперед и Назад, расположенные на панели инструментов браузера.
Перед тегом </BODY> добавьте еще один абзац. Абзац должен содержать следующий текст:” В Internet используется много различный типов протоколов, но один из основных – протокол IP. Именно он используется в качестве базового протокола для передачи информации в сети Internet.”. Абзацу должен предшествовать заголовок четвертого уровняю Заголовок должен содержать следующий текст “Протокол IP”. Организуйте ссылку на абзац с описанием протокола IP, аналогично тому, как это сделано для протоколов SLIP и PPP. Сохраните внесенные изменения и посмотрите полученный результат.
Для ознакомления с правилами применения внешних гиперссылок предположим, что мы хотим создать личную HTML-страницу (некоторое подобие персональной страницы в Internet), на которой мы поместим краткую информацию о себе и организуем ссылки на тематические разделы, которые мы хотим сделать доступнымии для сетевого сообщества. В качестве тематических разделов будем использовать HTML-страницы, созданные в предыдущих работах.
Запустите текстовый редактор и наберите следующий текст. Сохраните набранный текст в файле Index.htm (именно так чаще всего называются главные страныцы на Web-серверах).
<HTML>
<HEAD>
<META content="charset=windows-1251">
<TITLE>Домашняя страница ФИО</TITLE>
</HEAD>
<BODY>
<P align=center>
<FONT color=OLIVE>
Меня зовут ФИО. Я студент группы XXXX. <HR>
</FONT>
</P>
<P>
В процессе изучения HTML-гипертекста я ознакомился со следующими темами: <BR>
1. <A href = docum1.htm> Знакомство </A> с Internet Explorer и основами разработки HTML-страниц ; <BR>
2. <A href = docum2.htm> Знакомство </A> с основными приемами оформления HTML-страниц; <BR>
3. <A href = docum3.htm> Создание </A> гипертекста. <BR>
</P>
<P>
Здесь вы сможете познакомиться с описанием протокола <A href = docum3.htm#2> PPP </A>
</P>
</BODY>
</HTML>
Запустите барузер и просмотрите созданную вами страницу. Перейдите по ссылкам. Для возврата из ссылки к главной странице используйте кнопку Назад.
Добавьте гиперссылку на описание протокола SLIP в файле Docum3.htm.
<A href=#SLIP></A>SLIP
……………………..……..
<P> <A name=SLIP>
Описание протокола SLIP
</P>