Как сделать ссылку в html

Как сделать ссылку

Для создания ссылки необходимо сообщить браузеру, что является ссылкой, а также указать адрес документа, на который следует сделать ссылку. Оба действия выполняются с помощью тега , который имеет единственный обязательный атрибут href . В качестве значения используется адрес документа (URL).

Адрес ссылки может быть абсолютным и относительным. Абсолютные адреса работают везде и всюду независимо от имени сайта или веб-страницы, где прописана ссылка. Начинаются они с указания протокола передачи данных. Так, для веб-страниц это обычно HTTP (HyperText Transfer Protocol, протокол передачи гипертекста), соответственно, абсолютные ссылки начинаются с ключевого слова http:// (пример 1).

Пример 1. Использование абсолютных ссылок

Относительные ссылки, как следует из их названия, построены относительно текущего документа или адреса.

Примеры относительных адресов

/
/demo/ Эти две ссылки называются неполные и указывают веб-серверу загружать файл index.html (или default.html), который находится в корне сайта или папке demo. Если файл index.html отсутствует, браузер, как правило, показывает список файлов, находящихся в данном каталоге.

/images/pic.gif Слэш перед адресом говорит о том, что адресация начинается от корня сайта. Ссылка ведет на рисунок pic.gif, который находится в папке images. А та в свою очередь размещена в корне сайта.

../help/me.html Две точки перед именем указывают браузеру перейти на уровень выше в списке каталогов сайта.

manual/info.html Если перед именем папки нет никаких дополнительных символов, вроде точек, то она размещена внутри текущего каталога (пример 2).

Пример 2. Использование относительных ссылок

Как сделать ссылку в HTML

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

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

Атрибут href в качестве своего значения содержит адрес (относительный или абсолютный), на который будет вести ссылка. При щелчке на ссылку браузер получает и отображает документ, адрес которого указан в атрибуте href :

Результат данного примера в окне браузера:

примеры ссылок

Как убрать подчёркивание ссылки

Все HTML ссылки отображаются подчёркнутыми. Такой вид для ссылок задан в стилях, используемых браузерами по умолчанию. Чтобы убрать нижнее подчёркивание у ссылки надо изменить для неё стиль, это можно сделать двумя способами.

Первый способ: к ссылке, у которой надо отключить подчёркивание, добавляется атрибут style со значением text-decoration: none; :

Второй способ подойдёт в том случае, когда надо убрать подчёркивание сразу у всех ссылок в HTML документе. В CSS стилях прописываем для всех элементов свойство text-decoration со значением none :

Как создается ссылка в HTML?

В этой статье мы расскажем, как создается ссылка в HTML с одной страницы на другую. Также кратко опишем различные типы гиперссылок.

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

  • Ссылка в HTML-абсолютные адреса
  • Ссылка в HTML- относительные адреса
  • Ссылка в HTML — адреса относительно корня сайта
  • Ссылка в HTML — цели
  • Ссылка в HTML — ссылки перехода
  • Ссылка в HTML — ссылки на электронную почту
  • Ссылка в HTML — базовый href

Ссылка в HTML-абсолютные адреса

Это относится к случаю, когда URL-адрес содержит полный путь. Например:

Ссылка в HTML- относительные адреса

В этом случае в URL-адресе указывается путь относительно текущего положения. Например, если мы хотим сослаться на URL-адрес https://www.quackit.com/html/tutorial/ , а наше текущее местоположение — https://www.quackit.com/html/ , нужно использовать следующую ссылку:

Ссылка в HTML — адреса относительно корня сайта

Это относится к URL-адресу ссылки HTML , в котором определен путь относительно корня домена.

Например, если мы хотим ссылаться на URL-адрес https://www.quackit.com/html/tutorial/ , а текущее местоположение — https://www.quackit.com/html/ , нужно использовать следующую ссылку:

Прямой слэш означает корень домена. Независимо от того, где находится ваш файл, всегда можно использовать этот метод для определения пути, даже если вы не знаете, каким будет имя домена ( при условии, что вы знаете полный путь от корня ).

Ссылка в HTML — цели

Также можно определить, где будет открыт URL-адрес : в новом окне или в текущем. Это можно сделать с помощью атрибута target . Например, target = «_ blank» открывает URL в новом окне.

Атрибут target может принимать следующие значения:

Ссылка в HTML — ссылки перехода

Можно сделать ссылки, которые будут направлять в другие разделы в переделах одной страницы ( или другой ).

Вот как создается ссылка в HTML на эту же страницу:

  • Добавьте идентификатор к цели ссылки

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

  • Создайте гиперссылку

Теперь создайте гиперссылку. Это делается с помощью идентификатора цели ссылки, которому предшествует символ хэша ( # ):

Приведенные выше фрагменты кода размещены в разных частях документа. Получается примерно следующее:

Это необязательно должна быть одна и та же страница. Можно использовать этот метод, чтобы перейти к идентификатору любой страницы. Для этого перед тем, как вставить ссылку в HTML , добавьте целевой URL-адрес перед символом «#» . Например:

Конечно, предполагается, что на странице есть идентификатор с этим значением.

Ссылка в HTML — ссылки на электронную почту

Также можно создать гиперссылку на адрес электронной почты. Для этого используйте атрибут mailto в теге ссылки:

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

Можно автоматически заполнить строку темы для своих пользователей, и даже тело письма. Это делается путем добавления параметров subject и body к адресу электронной почты.

Ссылка в HTML — базовый href

Можно задать URL-адрес по умолчанию, с которого будут начинаться все ссылки HTML на странице. Для этого поместите тег base ( вместе с атрибутом href ) в элемент .

Ссылка на основную публикацию