Урок 5.1: Создание ссылок (гиперссылок)

Ссылки (или как правильней - гиперссылки) - одно из важных моментов любого сайта. Именно благодаря гиперссылкам можно перемещаться как внутри сайта (с одной страницы на другую), так и между сайтами.

Как же создать гиперссылку? Ответ прост - использую парный тег <a>текст ссылки</a>, с обязательным атрибутом href, который отвечает за адрес гиперссылки.

Пример создания гиперссылки.

<html>
 <head>
  <title>Создание гиперссылки</title>
 </head>
 <body>
 <a href="/my-photo.html">Моя фотография</a>
 </body>
</html>

Результат создания гиперссылки.

Страница с гиперссылкой

Пример работы гиперссылки можно посмотреть здесь.

В предыдущем примере в качестве ссылки использовался текст "Моя фотография". Кроме текста можно использовать изображение. Для этого необходимо тег изображения <img> поместить между тегами <a> и </a>

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

<html>
 <head>
  <title>Создание гиперссылки</title>
 </head>
 <body>
 <a href="/my-photo.html"><img src="/photo-small.jpg" /></a>
 </body>
</html>

Адреса гиперссылок могут быть абсолютными и относительными. В примере выше использовался относительный адрес гиперссылки, т.к. файл "my-photo.html" находится в той же директории, что и файл с гиперссылкой "Моя фотография". Можно использовать и абсолютный адрес, типа: "d:/my-work/html/lesson-5-1/my-photo.html", но это лишнее. Т.к. относительный адрес гораздо короче абсолютного.


Абсолютные адреса гиперссылок используются при ссылании на другие сайты. Например на этот урок - "http://in-sites/html/samoychitel/lesson-5-1-giperssulki".

В общем при использовании гиперссылок внутри сайта, используйте относительный адрес. А на другие сайты - абсолютный.

<< Цвета в таблице | Перечень уроков | Ссылки на якорь >>