Элемент a определяет гиперссылку (её также называют просто "ссылка"), которая используется для перехода с одной страницы на другую. Текстовое содержимое элемента a выступает в качестве названия ссылки. Внешне ссылку легко отличить от обычного текста, так как по умолчанию она отображается в виде подчеркнутого текста, а при наведении на нее курсора мыши, он принимает вид руки с указательным пальцем, как бы показывающим, что этот текст является активным и по нему можно кликнуть ЛКМ.
По умолчанию во всех браузерах ссылки выглядят следующим образом:
- Не посещенная ссылка - текст синего цвета
- Посещенная ссылка - текст фиолетового цвета
- Активная (при клике (и удерживании) ЛКМ) - текст красного цвета
В качестве ссылки может выступать не только текст, но и любой другой HTML-элемент, который может быть расположен в теле документа, если его разместить внутри элемента a.
Особенность ссылок состоит в том, что сама ссылка может вести не только на другую веб-страницу, но и на файл любого типа. Файл на который ведёт ссылка, открывается в окне браузера только в тех случаях, когда браузер знает тип документа, в других случаях выводится сообщение, как следует обработать файл - открыть его или сохранить в указанную папку.
По умолчанию, страница, на которую ведёт ссылка открывается в том же окне, где находится текущая ссылка. Ссылка, которая ведёт на несуществующую страницу, файл или изображение называется "мёртвая" или "битая".
Ссылки для перехода внутри веб-страницы
Ссылки можно также использовать для перехода к определенному месту внутри веб-страницы (не обязательно в текущей). Для определения места на странице к которому будет осуществлён переход по ссылке используется любой HTML-элемент. Чтобы определить элемент к которому будет сделан переход по ссылке, нужно использовать глобальный атрибут id, указав его у нужного элемента:
!-- значение атрибута может быть произвольным --
h2 id="a1"Заголовок/h2
Теперь, чтобы перейти к нему, в значении атрибута href элемента a мы должны указать значение атрибута id (идентификатор), перед которым нужно поставить символ решетки (#). Если элемент к которому будет сделан переход находится на одной странице с ведущей на него ссылкой, то имя документа в атрибуте href можно опустить, написав только идентификатор.
a href="#a1"ссылка/a
Чтобы перейти к определённому месту на другой странице, нужно указать необходимый идентификатор после URL-адреса:
a href="httр://www.example.com#a1"ссылка/a
a href="example/page.html#a1"ссылка/a
Основная польза от ссылок внутри веб-страницы заключается в том, что пользователю не приходится просматривать всю веб-страницу в поисках нужного раздела. Такие ссылки удобно применять на страницах с большим объемом содержимого, чтобы посетители могли быстро переходить к нужному им разделу.
Атрибуты
- href:
- Указывает URL-адрес веб-страницы, на которую будет сделан переход (количество символов в значении адреса не должно превышать 255). Поскольку в качестве адреса ссылки может быть указан путь к файлу любого типа, то результат перехода по ссылке будет зависеть от конечного файла.
Примечание: в качестве URL может быть использован или адрес.
- hreflang:
- Определяет язык текста в документе, на который ведет ссылка.
- media:
- Указывает тип носителя документа, на который ведёт ссылка.
- rel:
- Указывает отношение между текущим документом и документом, на который ведет ссылка. Возможные значения атрибута:
- alternate - ссылка на альтернативную версию документа (страница для печати, страница на другом языке и тд.)
- author - ссылка на автора документа
- bookmark - постоянный URL-адрес, используемый для закладок
- help - ссылка на документ-справку
- license - ссылки на сведения об авторских правах для документа
- next - следующий документ в выделенной области
- nofollow - ссылка на документ, который не нужно индексировать («nofollow» используется поисковой системой Google, чтобы указать, что поисковый бот не должен переходить по этой ссылке)
- noreferrer - указание браузеру не посылать HTTP-заголовок если пользователь перешел по ссылке
- prefetch - указывает, что следует кэшировать целевой документ
- prev - предыдущий документ в выделенной области
- search - ссылка на поиск для документа
- tag - тег (ключевое слово) для текущего документа
- target:
- Определяет, в каком окне откроется документ (по умолчанию ссылки открываются в текущем окне). Возможные значения атрибута:
- _blank - открывает документ в новом окне или вкладке
- _parent - открывает документ в родительском фрейме
- _self - открывает документ в той же директории, где располагается ссылка (значение по умолчанию)
- _top - открывает документ во всю ширину окна
- имя_фрейма - открывает документ в элементе , имя которого было указано в качестве значения
- type:
- Определяет MIME-тип документа, на который ведёт ссылка.
Примечание: атрибуты: hreflang, media, rel, target и type не могут быть использованы, если не установлен атрибут href.
Тег a так же поддерживает и
Пример
a href="some_document.html"Это ссылка/a