HTML ссылки

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

Ссылки создаются при помощи тега <a>. Данный тег является парным, строчным и имеет обязательный атрибут href, значением которого служит адрес, по которому мы будем переходить при клике по ссылке:

<a href="http://google.com">Ссылка ведущая на сайт google.com</a>

При помощи атрибута target вы можете открывать ссылку в новой вкладке, или в новом окне, если ваш браузер не поддерживает вкладки:

<a href="http://google.com" target="blank">Ссылка ведущая на сайт google.com</a>

Здесь значение атрибута blank отвечает за то, чтобы ссылка открывалась в новой вкладке. Если записать вместо blank значение newtab, то результат будет таким же.

Якоря

Якорь – это закладка на веб-странице, к которой можно перейти по ссылке.

Якорь должен иметь уникальное имя, которое задается при помощи атрибута id, например: <h1 id="top">Заголовок</h1>.

Ссылка, ведущая к якорю, должна содержать в пути его имя, начинающееся с символа решетки: <a href="#top">Наверх</a>.

Значение идентификатора должно начинаться с букв латинского алфавита, оно должно быть уникальным на странице, т.е. в одном документе не должно быть два идентификатора с одинаковыми значениями.

Ссылка на адрес электронной почты

<a href="mailto:psdhtmlcss@mail.ru">Написать мне письмо</a>

При клике по такой ссылке откроется почтовый клиент, в поле "Адрес получателя" будет указана почта, на которую ведет данная ссылка, т.е. psdhtmlcss@mail.ru.

Вы можете указать в этой ссылке дополнительные параметры, например, тему письма, текст письма и т.д., при помощи такой конструкции:

<a href="mailto:psdhtmlcss@mail.ru?ключ=значение&ключ2=значение2&ключ3=значение3">Написать мне письмо</a>

Рассмотрим на примере:

<a href="mailto:psdhtmlcss@mail.ru?subject=Заказать%20сайт&body=Здравствуйте!%0AЯ%20бы%20хотел%20заказать%20у%20вас%20сайт.&cc=pochtoviy-yashik@mail.ru&bcc=sexcoxrocnroll@yandex.ru">Заказать сайт</a>
  • subject – тема письма;
  • body – текст письма;
  • cc – адрес почты, на которую будет отправлена копия письма;
  • bcc – скрытый адрес почты, на которую будет отправлена копия письма;
  • %20 – символ для использования пробелов в теме или тексте письма;
  • %0A – символ для переноса текста на новую строку.

Ссылка на логин Skype

<a href="skype:oksanaturova">Позвонить мне по Skype</a>

При клике по такой ссылке вы совершите звонок по Skype абоненту с указанным логином.

Ссылка на номер ICQ

<a href="icq:279679659">Добавить меня в свой список контактов ICQ</a>

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

http, mailto, skype, icq – это имена сетевых протоколов, определяющих какая программа будет обрабатывать ссылку.


Видео к уроку

Комментарии