Ссылки

Для перемещения между страницами был придуман главный элемент в интернете — гиперссылки.

Гиперссылки могут ссылаться не только на другой ресурс в интернете, но и позволяют перемещаться внутри текущего документа. На данный урок вы тоже попали через гиперссылку.

Для создания ссылки используется тег a с обязательным атрибутом href — указанием страницы, на которую произойдёт переход после клика.

<a href="Ссылка на документ">Текст ссылки</a>

Ссылки можно поделить на 3 типа:

  • Относительные. Такие ссылки ссылаются на тот же сайт, с которого и происходит переход.
  • Абсолютные. Позволяют переходить на сторонние ресурсы в интернете.
  • Ссылки-якоря. Используются для перемещения внутри текущего документа.

Единственное различие относительных и абсолютных ссылок — формат, в котором указывается ссылка. В случае с относительными ссылками не указывается адрес источника, на который будет переход, он будет совпадать с источником, с которого произошёл переход:

<a href="/languages/html">Вернуться на выбор уроков</a>
<!-- ссылка указывает на документ внутри текущего сайта -->
<a href="https://code-basics.ru/">Перейти на сайт Code Basics</a>
<!-- Ссылка указывает на документ стороннего сайта. В данном случае на главную страницу Code Basics -->

Ссылки-якоря удобны в использовании внутри объёмного документа, и позволяют переместить пользователя к нужному месту. Например, если страница представляет с собой доклад, то удобнее, если есть возможность быстро переместиться к любому его разделу и обратно.

Создание ссылки-якоря состоит из двух действий:

  1. Блоку на странице, к которому мы хотим совершить переход нужно указать уникальный идентификатор. Делается это с помощью атрибута id.
  2. Разместить тег a и в атрибуте href указать ссылку вида #название-уникального-идентификатора.
<a href="#anchor">Переход на главу 2</a>
...
...
...
<div id="anchor">
    <h2>Глава 2</h2>
</div>

Задание

Вставьте в редактор абсолютную ссылку на сайт https://code-basics.ru/


Нашли ошибку? Есть что добавить? Пулреквесты приветствуютсяhttps://github.com/hexlet-basics

Упражнение доступно только авторизованным пользователям.

Пожалуйста, авторизуйтесь, это необходимо для отслеживания прогресса выполнения уроков. Если у вас ещё нет учётной записи, то сейчас самое время создать аккаунт.