Гиперссылки в HTML. Как сослаться и осуществить переход на другую страницу?

гиперссылки в html. как сослаться и осуществить переход на другую страницу?

Принцип связанности интернета

Все мы слышали словосочетание «всемирная паутина». Почему сложилась ассоциация именно с этой структурой из живой природы? Все очень просто. Паутина скрепляет пространство, она дает пауку возможность получать информацию о том, что происходит в его владениях. В интернете единицами информации являются HTML-страницы и файлы, гиперссылки связывают их как нити.

Гиперссылка — это специальный элемент HTML-разметки, устанавливающий связь с другой страницей или файлом. Они являются фундаментальной основой существования интернета. Браузеры, при клике на гиперссылку, осуществляют переход на связанную с ней страницу или загрузку файла.

Гиперссылки берут свое начало из печатных изданий. Возможно, вы сталкивались с ними, листая справочники. В них, в самом низу страницы указываются сноски на источники, из которых взята та или иная информация.

Заметка
Гиперссылки осуществляют связывание посредством специального атрибута, который должен содержать URL-адрес ресурса. URL является универсальным идентификатором источника информации в сети. Если вы не знакомы с данным понятием, изучите урок «Что такое URL-адрес?» из нашего учебного курса.

Использование гиперссылок

Для создания ссылки на другую страницу в HTML существует элемент <a>. Он не имеет своей ширины или высоты. Все содержимое, помещенное между открывающим тегом <a> и закрывающим </a>, будет являться ссылкой на указанный ресурс.

Курсор мыши, при наведении на элементы, находящиеся внутри гиперссылки, будет меняться на значок руки с вытянутым указательным пальцем. Это помогает пользователю визуально определить, что данный HTML-элемент используется как ссылка и позволяет перейти к просмотру другой страницы. Помимо изменения курсора мыши, текст, находящийся внутри гиперссылки, будет подсвечен синим цветом и иметь нижнее подчеркивание.

В элемент <a> можно помещать любой другой элемент или несколько. Единственное требование в том, что гиперссылки не могут быть вложенными друг в друга. Это является очень грубым нарушением правил HTML-разметки.

Для указания страницы или файла, с которым связана ссылка, используется атрибут href. В нем необходимо указать соответствующий URL-адрес. Также вы можете задать атрибут title, который будет выводить определенный текст при наведении курсора на гиперссылку. Ниже мы привели наглядный пример.

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Пример использования гиперссылок</title>
    </head>
    <body>
        <!-- Создаем ссылку из изображения. Она ведет на главную страницу -->
        <a href="https://coder-booster.ru" title="Ссылка на coder-booster.ru">
            <img src="https://coder-booster.ru/images/main-logo.png">
        </a>

        <!-- Создаем ссылку внутри текста. Она как тоже ведет на главную -->
        <p>Часть этого текста <a href="https://coder-booster.ru">будет являться</a> 
        ссылкой на главную страницу сайта coder-booster.ru.</p>
    </body>
</html>

Заметка
Этот урок не раскрывает все подробности использования ссылок. Далее в учебном курсе будут подробно рассмотрены дополнительные атрибуты данного элемента, а также абсолютные и относительные способы адресации.

Последние публикации