Ссылки в HTML, закладки, изображение-ссылка

html теги

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

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

Адрес ссылки может быть абсолютным и относительным. К абсолютному адресу относится полный путь к документу, включая протокол и наименование сайта, например http://www.yandex.ru. Абсолютные адреса применяются для перехода на другой ресурс, а внутри текущего сайта применяются относительные ссылки.

Подобные ссылки построены относительно текущего документа или корня сайта. Когда путь ведется от корня сайта, в начале пути добавляют слэш (символ /), например /forum/mail.htm. В этом случае сервер понимает, что ему следует загрузить документ по адресу http://www.greenlignt.com/forum/mail.htm.

Параметры тега А:

- HREF. Задает адрес документа, на который следует перейти.

- NAME. Этот параметр используется для определения закладки внутри страницы. Имя ссылки на закладку начинается символом #, после него идет название закладки.

- TARGET. По умолчанию новый документ загружается в текущее окно браузера, однако это свойство можно изменить с помощью параметра target тега А.

В качестве зарезервированных имен для target используются следующие:
blank — загружает страницу в новое окно браузера;
_self — загружает страницу в текущее окно;
_parent — загружает страницу во фрейм-родитель;
_top — отменяет все фреймы и загружает страницу в полном окне браузера;

Пример:

<html>
<head>
</head>
<body>
<р><a name=”tр”>Закладка</а></р>
<p><a href="http://www.yandex.ru" target="blank">Ссылка откроется в новом окне</a></p>
<а href=”#tp”>Перейти к закладке</а>
</body>
</html>

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

<p><a href =“http://www.yandex.ru"><img src="Рисунок1.jpg" width="200" height="150"></a></p>

В браузере такая ссылка выделяется рамкой. Цвет рамки соответствует цвету, установленному для ссылок.

<html>
<head>
</head>
<body bgcolor="white" text="black" link="blue" vlink="purple" alink="red">
. . .
</body>
</html>

Link - непосещенная ссылка. По умолчанию непосещённые ссылки изображаются синим цветом.

Alink - активная ссылка. Ссылка помечается как активная в момент ее открытия. Цвет такой ссылки по умолчанию красный.

Vlink - посещенная ссылка. Ее цвет по умолчанию фиолетовый.

Цвета ссылок задаются в качестве параметров тега BODY.

Но удобнее и грамотнее задавать цвет ссылки через стили CSS:

<html>
<head>
<style type=text/css>
A:link {color:blue } (цвет ссылки)
A:visited {color:purple } (цвет посещенной ссылки)
A:hover { color: #99FF00 } (цвет ссылки при наведении курсора)
A:active { color:red } (цвет активной ссылки)
</style>
</head>
<body>
. . .

Ссылки без подчеркивания. Подчеркивание текстовых ссылок уже стало определенным стандартом и сигналом о том, что это не просто текст, а именно ссылка. Но подчеркивание ссылки можно отменить, если это необходимо. Для этого можно воспользоваться параметром text - decoration: none. Пример:

<html>
<head>
<title>Название странички</title>
<style type="text/css">
A {text-decoration:none;}
</style>
</head>
<body bgcolor="white" text="black" link="blue" vlink="purple" alink="red">
<p><a href="http://yandex.ru">ЭТО ССЫЛКА</a></p>
</body>
</html>