Гиперссылки позволяют при помощи нажатия кнопки мыши быстро перемещаться от одного документа к другому. Именно гиперссылки связывают веб-страницы в единую сеть.
Внешние гиперссылки
Внешние гиперссылки вставляются в HTML-документ с помощью тега <a>
. Основным параметром тега <a>
является href
. Именно этот параметр задает URL-адрес веб-страницы, которая будет загружена при щелчке мыши на указателе. В качестве указателя может быть текст.
Пример:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Внешние гиперссылки</title>
</head>
<body>
<a href="http://www.w3.org/MarkUp/">HTML</a>
</body>
</html>
В окне веб-браузера это будет выглядеть ТАК.
Или изображение.
Пример:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Внешние гиперссылки</title>
</head>
<body>
<a href="http://www.w3.org/MarkUp/"><img src="../images/w3c_home.png" width="72" height="48" alt="HTML"></a>
</body>
</html
В окне веб-браузера это будет выглядеть ТАК.
Примечание. Кроме HTML-документов можно ссылаться и на файлы других типов, например изображения, архивы и т.д. При переходе по такой ссылке веб-браузер в зависимости от типа файла отобразит его, либо предложит сохранить.
URL-адреса бывают абсолютными и относительными.
Абсолютный URL-адрес
Абсолютный URL-адрес содержит обозначение протокола, доменный или IP-адрес компьютера, путь к файлу, а также имя файла. Например:
https://sevidi.ru/webd/htmpage.html
Если файл находится в корневой папке, то путь может отсутствовать:
https://sevidi.ru/news.html
Имя файла также может отсутствовать. В этом случае загружается веб-страница, заданная по умолчанию в настройках веб-сервера:
https://sevidi.ru/
https://sevidi.ru/webd/
Относительный URL-адрес
При относительном задании URL-адреса путь определяется с учетом местоположения веб-страницы, на которой находится ссылка. Возможны следующие варианты:
- если нужная веб-страница находится в той же папке, что и веб-страница, содержащая ссылку, то URL-адрес может содержать только имя файла. Если с
веб-страницы, находящейся по адресу:
-
https://sevidi.ru/webd/htmpage1.html
нужно перейти на страницу:
https://sevidi.ru/webd/htmpage2.html
то ссылка будет такой:
<a href = "htmpage2.html">Текст ссылки</a>
- если с веб-страницы, находящейся по адресу
-
https://sevidi.ru/webd/dweb/file1.html
нужно перейти на
https://sevidi.ru/webd/dweb/htmtest/file2.html
то ссылку можно указать так:
<a href = "htmtest/file2.html">Текст ссылки</a>
- если с веб-страницы, находящейся по адресу
-
https://sevidi.ru/webd/dweb/htmtest/file2.html
нужно перейти на
https://sevidi.ru/webd/dweb/file1.html
то ссылка будет такой
<a href = "../file1.html">Текст ссылки</a>
А при переходе с
https://sevidi.ru/webd/dweb/htmtest/file2.html
на
https://sevidi.ru/webd/file3.html
ссылка будет такой
<a href = "../../file3.html">Текст ссылки</a>
По умолчанию вызываемый при активации ссылки документ открывается в текущем окне браузера, заменяя документ, содержащий эту ссылку. Это происходит, если браузер способен открыть документ в своем окне (некоторые документы открываются в окне соответствующих приложений). Можно задать в каком окне браузера или фрейме следует открыть вызываемый документ. Это делается с помощью атрибута target
, который принимает следующие значения:
имя_окна
— имя окна или фрейма;_parent
— указатель на родительский фрейм;_blank
— указатель на новое окно;_top
— указатель на фрейм верхнего уровня;_self
— указатель на тот же самый (текущий) фрейм.
Если требуется, чтобы при наведении указателя мыши на указатель ссылки появилась всплывающая подсказка (поясняющий текст), то в теге <a>
следует использовать атрибут title
, принимающий в качестве значения текст всплывающей подсказки.
Пример:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Гиперссылки. Всплывающая подсказка</title>
</head>
<body>
<a href="59.html" title="ссылка" target="_blank">Ссылка</a>
</body>
</html>
В окне веб-браузера это будет выглядеть ТАК.
Внутренние гиперссылки
С помощью внутренних гиперссылок можно создать ссылки на разные разделы текущей веб-страницы. Если документ очень большой, то наличие внутренних гиперссылок позволяет быстро перемещаться между разделами.
Внутренняя гиперссылка также вставляется при помощи тега <a> с одним лишь отличием — параметр href
содержит имя указателя, а не URL-адрес. Перед именем указателя ставится знак #
.
<a href = "#y1">Глава 1</a>
Указатель создается с помощью тега <a>
, но вместо параметра href
используется параметр name
, который задает имя указателя.
<a name = "y1">Глава 1</a>
Иногда указатель называют "якорем". Также можно сослаться на якорь другого документа. Это делается так:
<a href = "https://sevidi.ru/webd/dweb/htmpage1.html#y1">Структура документа</a>
Пример:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Структура документа с внутренними гиперссылками</title>
</head>
<body>
<h1 align="center">Название документа</h1>
<h2>Оглавление</h2>
<ul type="disc">
<li><a href="#y1">Глава 1</a>
<li><a href="#y2">Глава 2</a>
<li><a href="#y3">Глава 3</a>
<li><a href="#y4">Глава 4</a>
</ul>
<br>
<h2><a name="y1">Глава 1</a></h2>
<p>Содержание главы 1</p>
<h2><a name="y2">Глава 2</a></h2>
<p>Содержание главы 2</p>
<h2><a name="y3">Глава 3</a></h2>
<p>Содержание главы 3</p>
<h2><a name="y4">Глава 4</a></h2>
<p>Содержание главы 4</p>
</body>
</html>
В окне веб-браузера это будет выглядеть ТАК.
Гиперссылки на адрес электронной почты
Ссылка на адрес электронной почты выглядит так:
<a href = "mailto:[email protected]">Текст</a>
Вместо URL-адреса указывается адрес электронной почты, перед которым добавляется слово "mailto:
".
Примечание. Не следует публиковать ссылку с адресом электронной почты на сайте. Такие ссылки автоматически собираются роботами, и в дальнейшем этот E-mail будет завален спамом.
Комментарии(0)
Для добавления комментариев надо войти в систему и авторизоватьсяКомментирование статей доступно только для зарегистрированных пользователей:Зарегистрироваться