Ссылка-якорь

Ссылка-якорь – это термин, который используется для обозначения ссылок, перенаправляющих пользователей на определенную область экрана. Якорные ссылки направляют пользователей в нужный раздел сайта. Чаще всего такие невидимые отметки используются на одностраничных сайтах.

Создание ссылки-якоря (anchor link) предполагает наличие двух основных элементов: самой ссылки, указывающей на определенный раздел или элемент на странице, и якоря, к которому эта ссылка ведет. Чтобы создать такую ссылку при помощи HTML, можно использовать следующий подход:

  1. Определите якорь: Якорем может быть любой элемент на странице, к которому вы хотите создать ссылку. Обычно это заголовок или определенный раздел. Для этого элемента нужно задать уникальный идентификатор (ID). Например:

    <h2 id=»section1″>Заголовок раздела</h2>

    Создайте ссылку: Чтобы создать ссылку на этот якорь, используйте тег <a> с атрибутом href, в котором указывается ID якоря, предваренный символом решетки (#). Например:

    <a href=»#section1″>Перейти к разделу</a>

    Когда пользователь кликает по такой ссылке, браузер переносит его к элементу с соответствующим ID.

    Пример использования в HTML-документе:

    <!DOCTYPE html>
    <html>
    <head>
    <title>Пример страницы с якорной ссылкой</title>
    </head>
    <body>

    <h1>Пример страницы</h1>

    <!— Ссылка, которая ведет к якорю —>
    <a href=»#section1″>Перейти к разделу «Заголовок раздела»</a>

    <!— Контент страницы… —>

    <!— Якорь —>
    <h2 id=»section1»>Заголовок раздела</h2>
    <p>Текст раздела…</p>

    </body>
    </html>

    В этом примере, когда пользователь нажимает на ссылку «Перейти к разделу ‘Заголовок раздела'», страница автоматически прокручивается к разделу с заголовком «Заголовок раздела».

Похожие статьи:

При нахождении на сайте Вы соглашаетесь на политику обработки персональных данных.
Всё понятно!