HTML тег <a>
Пример
Ссылка на W3Schools.com:
<a href="https://www.w3schools.com">Посетите W3Schools.com!</a>
Попробуйте сами »
Больше примеров далее "Попробуйте сами".
Определение и использование
Тег <a> определяет гиперссылку, которая используется для перехода с одной страницы на другую.
Наиболее важным атрибутом элемента <a> является атрибут href, который указывает на назначение ссылки.
По умолчанию ссылки будут выглядеть следующим образом во всех браузерах:
- Непосещенная ссылка подчёркнута и синим цветом
- Посещённая ссылка подчёркнута и фиолетовым цветом
- Активная ссылка подчёркнута и красным цветом
Поддержка браузерами
| Элемент | |||||
|---|---|---|---|---|---|
| <a> | Yes | Yes | Yes | Yes | Yes |
Все современные браузеры поддерживают тег <a>.
Советы и заметки
Примечание: Следующие атрибуты: download, hreflang, media, rel, target и type не могут присутствовать, если отсутствует основной атрибут href.
Примечание: Связанная страница обычно отображается в текущем окне браузера, если вы не укажете другую цель с помощью атрибута target.
Совет: Для стилизации ссылок используйте CSS: CSS Ссылки. Учебник и CSS Кнопки. Учебник
Различия между HTML 4.01 и HTML5
В HTML 4.01 тег <a> может быть гиперссылкой или якорем. В HTML5 тег <a> является всегда гиперссылкой, но если он не имеет атрибута href, он является только заполнителем для гиперссылки.
Спецификация HTML5 имеет некоторые новые атрибуты для ссылок, а некоторые атрибуты спецификации HTML 4.01 уже больше не поддерживаются.
Атрибуты
| Атрибут | Значение | Описание |
|---|---|---|
| charset | char_encoding | Не поддерживается в HTML5. Определяет набор символов связанного документа |
| coords | coordinates | Не поддерживается в HTML5. Определяет координаты ссылки |
| download | filename | Указывает, что цель будет загружена, когда пользователь нажимает гиперссылку |
| href | URL | Определяет URL страницы, на которую идет ссылка |
| hreflang | language_code | Определяет язык связанного документа |
| media | media_query | Указывает, для какого носителя/устройства оптимизирован связанный документ |
| name | section_name | Не поддерживается в HTML5. Используйте глобальный
id атрибут вместо этого. Определяет имя якоря |
| ping | list_of_URLs | Определяет разделенный пробелами список URL-адресов, по которым при переходе по ссылке браузер будет отправлять запросы на отправку сообщений с помощью основного текста (в фоновом режиме). Обычно используется для отслеживания. |
| referrerpolicy | no-referrer no-referrer-when-downgrade origin origin-when-cross-origin unsafe-url |
Указывает, какой реферер отправить |
| rel | alternate author bookmark external help license next nofollow noreferrer noopener prev search tag |
Определяет связь между текущим документом и связанным документом |
| rev | text | Не поддерживается в HTML5. Определяет связь между связанным документом и текущим документом |
| shape | default rect circle poly |
Не поддерживается в HTML5. Определяет форму ссылки |
| target | _blank _parent _self _top framename |
Указывает, где открыть связанный документ |
| type | media_type | Определяет тип мультимедиа связанного документа |
Глобальные атрибуты
Тег <a> также поддерживает Глобальные атрибуты в HTML.
Атрибуты события
Тег <a> также поддерживает атрибуты события в HTML.
Попробуйте сами - Примеры
Создать гиперссылки
Как создать гиперссылки.
Создать кликабельное изображение
Как использовать изображение в качестве ссылки.
Открыть ссылку в новом окне браузера
Как открыть ссылку в новом окне браузера, чтобы посетителю не пришлось покидать ваш веб-сайт.
Создать ссылку на электронную почту
Как сделать ссылку на почтовое сообщение (будет работать, только если у вас установлена программа - почтовый клиент).
Создать другую ссылку электронной почты
Другая почтовая ссылка.
Создать телефонную ссылку
Как сделать ссылку на номер телефона.
Ссылка на другой раздел на той же странице
Как создать ссылку на элемент с указанным идентификатором на странице (атрибут name не поддерживается в HTML5).
Ссылка на JavaScript
Как добавить JavaScript внутри атрибута href.
Связанные страницы
HTML Учебник: HTML Ссылки
HTML DOM Справочник: Объект Anchor
CSS Учебник: Стилизация ссылок
Настройки CSS по умолчанию
Большинство браузеров будут отображать элемент <a> со следующими значениями по умолчанию:
a:link, a:visited {
color: (встроенное значение);
text-decoration: underline;
cursor: auto;
}
a:link:active, a:visited:active {
color: (встроенное значение);
}
Примечание. Если ссылки не стилизованы с помощью CSS, то они будут отображаться согласно встроенному значению, т.е. настройкам браузера по умолчанию.
Сайт работает на фреймворке W3.CSS.
