Создание базовой ссылки
Для создания ссылок в HTML используется тег <a>. Всё, что находится между <a> и </a>, будет текстом ссылки. Например:
<a>Перейти в Google</a>
Этот код отобразит «Перейти в Google» как обычный текст. Чтобы сделать его ссылкой, необходим атрибут href. Тег <a> без href не является ссылкой.
Атрибут href содержит URL. Например:
<a href="https://google.com">Перейти в Google</a>
Теперь клик на «Перейти в Google» перенаправит пользователя на Google.
Атрибут title
Атрибут title добавляет подсказку при наведении курсора:
<a href="https://google.com" title="Нажми на меня">Перейти в Google</a>
Появится подсказка «Нажми на меня».
Атрибут target
Атрибут target управляет открытием ссылки:
- _self (по умолчанию): Ссылка открывается в текущей вкладке.
- _blank: Ссылка открывается в новой вкладке.
Пример target="_blank":
<a href="https://google.com" target="_blank">Перейти в Google</a>
Ссылки на локальные файлы
Навигация между HTML-файлами осуществляется с помощью относительных путей. Например, для файлов index.html и about.html:
<a href="about.html">Перейти на страницу "Про нас"</a>
(в index.html). Файлы должны находиться в одной директории. Путь / перед именем файла не нужен при локальном запуске, но требуется на локальном сервере.
Якорные ссылки
Якорные ссылки позволяют переходить к месту на странице.
- Создание якоря: Используйте атрибут name в <a> без href:
<a name="bottom_page"></a>
- Ссылка на якорь: Используйте # перед именем якоря в href:
<a href="#bottom_page">Вниз</a>
Клик на «Вниз» переместит к bottom_page.
Ссылки на почтовые клиенты
Для ссылки, открывающей почтовый клиент с заполненными полями:
<a href="mailto:admin@aitprager.com">Написать на почту</a>
Откроется клиент с адресом admin@aitprager.com.
Комбинирование и встраивание
Внутри ссылок можно использовать другие HTML-теги, а ссылки встраивать в другие элементы.
Создание ссылок — важный аспект веб-разработки. Изучив основы, вы сможете создавать эффективные ссылки на внешние ресурсы, локальные файлы и якоря.