Ссылки, гиперссылки. Фреймы.

Ссылки в HTML - программах.

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

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

В качестве ссылки можно использовать текст или графику.

Браузер выделяет (обычно цветом и/или подчеркиванием) слова, являющиеся ссылками. Цвет выделения ссылок устанавливается в теге BODY:

LINK - устанавливает цвет выделения ссылок.
VLINK - устанавливает цвет выделения ссылок на которых уже побывали.
ALINK - устанавливает цвет активной ссылки.

Возможны ссылки:

на удаленный HTML-файл;
на некоторую точку в этом же документе;
на любой файл, не являющийся HTML-документом.

Тег <A>...</A> создает гиперссылку.

Атрибуты:
HREF - имя документа (URL-адрес), к которому осуществляется переход.
TITLE задает текст, который выскочит, если задержать курсор мыши на указателе
TARGET указывает, куда должна загружаться вызываемая страничка. Если указать TARGET=_blank, то браузер загрузит вызываемую страничку в новое окно. Если этот атрибут опустить, то новая страничка загрузится в текущее окно.

Ссылка на другой документ.

Описывается ссылка на другой документ следующим образом:

<A HREF="имя файла"> Текст, который будет служить как обращение к другому документу</A>.

URL-адрес может быть абсолютным и относительным.

Абсолютный адрес полностью определяет компьютер, каталог и файл, в котором находится документ

Абсолютный адрес документа, находящегося на локальном компьютере, будет включать в себя путь файла и имя файла, например:

HREF="file://D:\IVANOVA\Ivanova.HTM"

Абсолютный адрес документа, находящегося на удаленном компьютере в Интернете, будет включать имя сервера интернета, путь файла и имя файла, например:

HREF="http://omsu.omskreg.ru"

Относительный URL-адрес файла указывает на местонахождение документа относительно того документа, в котором находится ссылка. Например, если файл вызываемого документа находится в том же каталоге, что и файл из которого он вызывается, то можно указывать только имя файла:

HREF="Ivanova.HTM"

Пример: В страницу "menu.htm" вставим гиперссылки на другие страницы:

<HTML>
<HEAD>
<TITLE>Содержание</TITLE>
</HEAD>
<BODY BACKGROUND="fon.jpg" BGPROPERTIES=FIXED>

<LI><A HREF="mikky.htm">Микки Маус</A></LI>

<LI><A HREF="disney.htm">Уолт Дисней</A></LI>

<UL>

<LI>Детство и юность</LI>

<LI>Покорение Голливуда</LI>

<LI>Смерть</LI>

</UL>

<LI><A HREF="Photo.htm">Мои друзья</A></LI>

</OL>

</BODY>
</HTML>

Задание: в свою страницу menu.HTM ссылки на соответствуюшие файлы.

Ссылки в пределах одного документа.

Ссылки в пределах одного документа требуют наличия двух частей: метки и ссылки.
Метка определяет точку, на которую происходит переход по ссылке.

Такие ссылки описываются также как и ссылки на другой документ, с тем лишь отличием, что ссылка использует имя метки, определенной заранее.

Атрибут NAME - задает имя метки.
Перед именем метки ставится символ #.
Пример. Вернемся к страничке Disney.HTM:: определим метки в тексте;; определим ссылки на сайты о Диснее в Интернете.

<HTML>
<HEAD>
<TITLE>Немного о жизни великого Диснея.</TITLE>
</HEAD>
<BODY BACKGROUND="fon.jpg" TEXT = blue BGPROPERTIES=FIXED>

Немного о жизни великого Диснея.

<BLOCKQUOTE>"Я не снимаю фильмы для того, чтобы делать деньги, я делаю деньги, чтобы снимать больше хороших фильмов"</BLOCKQUOTE>

<A NAME="детство">Детство и юность</a>

Родился Уолт Дисней 5 декабря 1901года в Чикаго. Через четыре года после его рождения семья Диснея переехала на ферму недалеко от миссурийского города Марселин. Там малыш впервые увидел коров, лошадей, свиней и начал… рисовать их.

<A NAME="Голливуд">Покорение Голливуда.</a>

Следующим популярным персонажем Диснея стал Кролик Освальд. К сожалению, автор забыл запатентовать героя, и того самым наглым образом у него украли

<A NAME="Голливуд">Смерть великого американца.</a>

Утром 15 декабря 1966 года Уолт Дисней, всю жизнь дымивший, как паровоз, умер от рака легких в больнице через дорогу от своей любимой студии. Смерть застала его в самый разгар работы над мюзиклом “Счастливейший из миллионеров” и мультфильмом “Книга джунглей”.

Если Вы хотите почитать еще кое-что о Диснее, то могу предложить Вам пройтись по следующим ссылкам:

<A HREF="http://www.yustdisney.com/WaltDisney100/"> http://www.yustdisney.com/WaltDisney100/</A>

<A HREF="http://www.buhgal.narod.ru/PEOPLE/disney.htm"> http://www.buhgal.narod.ru/PEOPLE/disney.htm</A>

<A HREF="http://www.neapolis.ru/country/USA/15.htm"> http://www.neapolis.ru/country/USA/15.htm</A>

</BODY>
</HTML>

Адрес может быть относительный: имя файла в пределах данного компьютера плюс имя метки в пределах данного файла;
или абсолютный адрес: полное имя файла с диска данного компьютера плюс имя метки в пределах данного файла.

Пример. Определим в menu.HTM ссылки на установленные в Disney.HTM метки.

<HTML>
<HEAD>
<TITLE>Содержание</TITLE>
</HEAD>
<BODY BACKGROUND="fon.jpg" BGPROPERTIES=FIXED>

<LI><A HREF="mikky.htm">Микки Маус</A></LI>

<LI><A HREF="disney.htm">Уолт Дисней</A></LI>

<UL>

<LI><A HREF="disney.htm#детство">Детство и юность</A></LI>

<LI><A HREF="disney.htm#Голливуд">Покорение Голливуда</A></LI>

<LI><A HREF="disney.htm#смерть">Смерть</A></LI>

</UL>

<LI><A HREF="Photo.htm">Мои друзья</A></LI>

</OL>

</BODY>
</HTML>

Задание:

1. Установите метки в какой-либо своей странице;
2. В документе menu.HTM определите ссылки на эти метки.

Ссылка на E-mail.

Cсылка на почтовый ящик (E-mail) прописывается следующим образом:

<A HREF="mailto:pochta@mail.ru">Напишите мне письмо</A>

<HTML>
<HEAD>
<TITLE>Страничка Микки</TITLE>
</HEAD>
<BODY BACKGROUND="fon.jpg" TEXT = blue BGPROPERTIES=FIXED>

Рад приветствовать Вас на своей домашней страничке

Прежде всего, позвольте представиться. 
Я – веселый мышонок по имени <BIG>Микки.</BIG>
Живу я в огромной сказочной стране
Диснейленде. Вместе со мной живут
мои друзья: братья Билли, Вилли,
Дилли с их дядюшкой Дональдом,
забавный медвежонок Винни, славный
олененок Бэмби, озорной щенок Плуто
и многие-многие другие.

Так вот, к чему это я. Дело в том, что в прошлом году исполнилось 100 лет человеку, без которого сегодня трудно представить нашу (а значит, и вашу) жизнь. Этот человек – наш создатель Уолт Элиас Дисней.

Без лишней скромности могу сказать, что я, Микки Маус – пожалуй, самый знаменитый персонаж Диснея. И я на своей домашней страничке решил поделиться с вами тем, что знаю о жизни своего "родителя". Читайте дальше…

<A HREF="mailto:mikky@mail.ru">Напишите мне письмо</A>
</BODY>
</HTML>

Задание: вставьте в страничку о себе ссылку на свой E-mail.

Гиперссылка-картинка.

В качестве ссылки можно использовать не только текст, но и графику.
Для того, чтобы использовать в качестве , достаточно заключить тег IMG в тег A. Например, <a href="File.htm"><img src="image.jpg" width="96" height="67"></a>

Задание: вставьте на каждую страницу картинку-гиперссылку, при нажатии на которую посетитель вашего сайта перейдет на первую страницу сайта.

Картинку с надписью "назад", "домой", "вернуться" Вы можете взять из приложения 2.

Контрольные вопросы:

На какие документы возможны гиперссылки?
Как прописывается ссылка на E-mail?

На этом уроке Вы должны были:

В страницу с содержанием вставить гиперссылки, включая ссылки на метки;
В странице о себе указать ссылку на свой E-mail;
На каждую страницу вставить картинку-гиперссылку.