HTML тег a

Тег <a> используется для создания гипертекстовой ссылки. Гиперссылка может быть на другую веб-страницу, на какое-либо место внутри веб-страницы, на любой документ, на электронный адрес или вообще на любое место или объект в сети.

По умолчанию все браузеры отображают ссылки следующим образом:

  • Непосещенная ссылка - подчеркнутый текст синего цвета
  • Посещенная ссылка - подчеркнутый текст фиолетового цвета
  • Активная (при клике (и удерживании) ЛКМ) - подчеркнутый текст красного цвета

В качестве ссылки может выступать не только текст, но и любой другой HTML элемент, который может быть расположен в теле документа, если его разместить внутри элемента <a>.

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

Атрибуты download, hreflang, media, rel, target и type использовать нельзя, если не определен атрибут href.

Страница, на которую указывает ссылка, открывается в том же окне браузера, что и страница с этой ссылкой, если не указать особо.

Чтобы определить элемент внутри страницы, к которому будет осуществлён переход по ссылке, нужно использовать глобальный атрибут id, указав его у соответствующего элемента:


<!-- значение атрибута id может быть любым -->
<div id="a1">Новый раздел</h2>

После этого, чтобы перейти к нему, в значении атрибута href тега <a> необходимо указать значение атрибута id (идентификатор) с символом решетки (#) перед ним. Если элемент к которому будет сделан переход находится на той же самой странице, то адрес страницы в атрибуте href можно опустить, написав только идентификатор.


<!-- анкор внутри той же самой страницы -->
<a href="#a1">ссылка</a>

<!-- анкор на другой странице -->
<a href="//msiter.ru/#a1">ссылка</a>
<a href="//msiter.ru/page.html#a1">ссылка</a>

Разница между HTML 4.01 и HTML5

В HTML 4.01 тег <a> может быть либо анкором, либо гиперссылкой. В HTML5 тег <a> - всегда гиперссылка, однако, если у него не определен атрибут href, то он считается всего лишь "заполнителем" для гиперссылки.

В HTML5 были добавлены новые атрибуты и некоторые атрибуты, допустимые в HTML 4.01, удалены.

Атрибуты тега <a>

АтрибутОписание
charsetОпределяет кодировку символов документа, на который ведет ссылка
coordsОпределяет координаты ссылки в карте изображений
downloadОпределяет, что документ, на который указывает ссылка, будет загружаться
hrefОпределяет URL страницы, на которую ведет ссылка
hreflangОпределяет язык документа, на который указывает ссылка
mediaОпределяет устройство вывода, для которого оптимизирован документ, на который ведет ссылка
nameОпределяет имя анкора
relОпределяет отношение с документом, на который ведет ссылка
revОпределяет отношение с документом, на который ведет ссылка
shapeОпределяет форму ссылки в карте изображений
targetОпределяет, где открывать документ, на который ведет ссылка
typeОпределяет медиа-тип документа, на который указывает ссылка

Общие атрибуты

Тег <a> поддерживает общие атрибуты и атрибуты-события.

CSS стили по умолчанию


a:link, a:visited { 
    color: (internal value);
    text-decoration: underline;
    cursor: auto;
}

 a:link:active, a:visited:active { 
    color: (internal value);
}

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

Ссылка на сайт:


<a href="http://www.msiter.ru">Ссылка на URI</a>
<a href="#content">Ссылка на анкор</a>