Ссылки позволяют связывать HTML документы между собой.

HTML гиперссылки

Гиперссылки являются основой HTML и всемирной паутины. Они представляют собой текст (или картинку), нажав на который, пользователь будет перемещен на другой документ или другое место в данном документе.

Гиперссылки выделяются на страницах подчеркнутым шрифтом синего цвета.

В HTML существует 2 вида гиперссылок:

• Внешние гиперссылки перемещают пользователя нажавшего на них на другой HTML документ.
• Внутренние гиперссылки перемещают пользователя на предварительно созданную закладку в документе, в котором они определены.

Обратите внимание: для краткости гиперссылки могут упоминаться как просто "ссылки".

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

Создание внешней гиперссылки:

<a href="адрес">Текст ссылки </a>

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

Создание внутренней гиперссылки:

<!-- Создание гиперссылки на закладку -->
<a href="#bookmark">Текст ссылки </a> 
<!-- Создание закладки -->
<a id="bookmark">Текст закладки. </a>

bookmark имя закладки (может быть произвольным).

Примеры использования

Создадим внешние ссылки ведущие на главную страницу нашего сайта.

<a href="/"> www.wisdomweb.ru </a>
<a href="/"> 
<img src='/images/logo14.gif' width='200' height='60' />
</a>

Теперь создадим внутренние ссылки на закладки:

<a href='#chapter3'>Перейти на главу 3</a>
<a href='#chapter5'>Перейти на главу 5</a>

Обратите внимание: закладка в отличие от ссылки никак не выделяется на странице.

Атрибут target

Атрибут target указывает как будет открываться документ, на который указывает ссылка.

Данный атрибут может иметь следующие значения:

• _top документ откроется в текущем окне браузера;
• _blank документ откроется в новом окне браузера;
• _self документ откроется в текущем фрейме;
• _parent — документ откроется в родительском фрейме.

<a href="html://www.wisdomweb.ru" target="_blank">Это ссылка на сайт www.wisdomweb.ru</a>

Сделайте сами

Задание 1 по адресам перечисленным ниже находятся буквы кодового слова. Создайте ссылки на них в редакторе, перейдите на страницы и составьте кодовое слово:

1. https://www.wisdomweb.ru - папка link - файл pagea.html
2. https://www.wisdomweb.ru - папка link - файл wordf.html
3. https://www.wisdomweb.ru - папка CSS - файл findw.html
4. https://www.wisdomweb.ru - папка HTML - файл secw.html

Задание 2 создайте ссылки на закладки находящиеся в коде:

<p><b>В данном тексте находятся 4 закладки. Создайте ссылки на них.</b></p>
<!-- Пишите код здесь -->