Предварительные указания по порядку выполнения работы

 

1. Изучите теоретическую вводную часть к данной работе.

2. При необходимости, используйте вводную часть работы №8.

3. В приложении к сборнику лабораторных работ находитсясправочник по тэгам языка HTML

4. Отчётом по данной работе является страница (файл) HTML, имя которого является фамилией студента с инициалами.

5. При выполнении работы создание и редактирование текста выполняется при помощи редактора Блокнот (Notepad).

6. Просмотрстраниц выполняется из браузера Internet Explorer.

 

Введение. Организация связи документов на сайте (ссылок).

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

Чтобы включить ссылку в документ необходимо:

1. Поместить в текст тэг <A >. После символа А следует пробел.

2. Указать имя файла, на который происходит ссылка в формате: HREF=”имя файла” и закрывающую скобку >.

3. Ввести текст ссылки.

4. Указать на завершение тега </A>

ПРИМЕР

<A HREF=”GLAVA2.HTM”>Глававторая</A>     В данном примере фраза «Глава вторая» является ссылкой на HTML –документ, GLAVA2.HTM,находящийсяв том же каталоге (папке), что и текущий документ

 

Если же документ находится в другом каталоге, то необходимо указать имя этого каталога (или путь), например:

 

<A HREF=”BOOK/GLAVA2.HTM”>Глававторая</A>

Такие ссылки называются относительными. При необходимости можно задать и абсолютные имена файлов. Последние обычно используются для ссылок на несвязанные между собой документы, например:

<A HREF=”http:/www.cpress.ru/BOOK/GLAVA2.HTM”> Глава вторая </A>

Здесь http:/www.cpress.ru – так называемый URL – Uniform Resource Locator (унифицированный адрес ресурсов).

Ссылки на фрагмент документа

Для создания ссылки из документа DOCUM1на какой-то раздел (абзац) документа, содержащегося в файле DOCUM2, необходимо сначала создать именованную ссылку (метку) в документе DOCUM2:

<A NAME=”PETJA”>ПетяИванов</A>,

а затем ссылку на неё из документа DOCUM1, указывая не только имя файла, но и имя ссылки, разделив их символом #.

<A HREF=”DOCUM2#PETJA”>Привет от Петра</A>.

В этом примере фраза «Привет от Петра» является ссылкой на метку ”PETJA” документаDOCUM2.

Для организации ссылок на разделы одного и того же документа используется та же технология, но в адресе ссылки не указывается имя файла. Например, чтобы перейти в именованный разделPETJA в документе DOCUM2, надо создать следующую ссылку:

<A HREF=”#PETJA”>

 

Цвета ссылок можно определить в теге стилей <style> (это так называемые каскадные стили.) При этом значения атрибутов, определенныхв тэге <style> имеют приоритет перед определениями, сделанными в теге BODY или в теле документа.

Пример:

<head>

<style>

a:link {color:#ff5500; font-weight:normal; }

a:visited {color:#00ff00; font-weight:normal; }

a:hover {color:blue; font-weight:normal; }

</style>

</head>

Графические ссылки

Такие ссылки позволяют щёлкнуть на изображении и перейти к другому файлу.

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

ПРИМЕР

<A HREF=”DOG.HTM”><IMG SRC=”images/dog1.gif” ALT=”Собака” WIDTH=60 HEIGHT=80></A>

Целесообразно для графических ссылок не уменьшать размер исходного изображения при помощи атрибутовWIDTH иHEIGHT, а создавать отдельные миниатюрные изображения. Это существенно ускорит процесс загрузки документа.