САМОУЧКА

Сайт для тех, кто хочет научиться

Наши публикации

<Предыдущая                              Следующая>

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

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

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

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

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

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

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

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

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

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

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

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

<!-- Создание гиперссылки на закладку -->

<a href="#bookmark">Текст ссылки </a>

<!-- Создание закладки -->

<a id="bookmark">Текст закладки. </a>

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

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

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

Пример

<a href="http://www.wisdomweb.ru"> www.wisdomweb.ru </a>

<a href="http://www.wisdomweb.ru">

<img src='http://www.wisdomweb.ru/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. http://www.wisdomweb.ru - папка link - файл pagea.html

2. http://www.wisdomweb.ru - папка link - файл wordf.html

3. http://www.wisdomweb.ru - папка CSS - файл findw.html

4. http://www.wisdomweb.ru - папка HTML - файл secw.html

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

Пример

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

<!-- Пишите код здесь -->

<Предыдущая                              Следующая>

Последние добавления

HTML для новичков

XHTML

CSS для новичков