Программирование

Создание гиперссылок

Элемент a, относительные и абсолютные адреса, ссылки на e-mail.

Все уроки · Уроки HTML: учимся с нуля

Элемент a

Ссылка создаётся элементом <a>, адрес назначения пишется в атрибуте href. Текст ссылки должен описывать цель: не «нажмите здесь», а «открыть прайс-лист».

<a href="https://example.com/prices">Open the price list</a>
<a href="https://example.com" target="_blank" rel="noopener">New tab</a>

target="_blank" открывает ссылку в новой вкладке; для безопасности добавляйте rel="noopener".

Абсолютные и относительные адреса

Абсолютный адрес начинается с https:// и ведёт на другие сайты. Относительный указывает на файл вашего сайта относительно текущей страницы: about.html — в той же папке, ../index.html — уровнем выше, docs/guide.html — во вложенной папке.

<a href="about.html">About</a>
<a href="../index.html">Home</a>
<a href="docs/guide.html">Guide</a>

Якоря, почта и телефон

Чтобы перейти к месту на той же странице, задайте элементу id и ссылайтесь через #id. mailto: открывает почту, tel: — набор номера.

<a href="#contact">Go to contact</a>
...
<h2 id="contact">Contact</h2>
<a href="mailto:hello@example.com">Write to us</a>
<a href="tel:+994120000000">Call us</a>
  • Если ссылка ведёт на файл другого типа (PDF), укажите это в тексте.

Автор: Nibras Code