<link> HTML

Тег <link> (от англ. link — ссылка, связь) устанавливает связь с внешним документом вроде файла со стилями или со шрифтами.

Элемент <link> обычно размещается внутри контейнера <head> и не создаёт ссылку, в отличие от элемента <a>.

Синтаксис

<head>
  <link href="<адрес>">
</head>

Закрывающий тег не требуется.

WAI ARIA

Значение role по умолчанию: link

Атрибуты

  • href — Путь к связываемому файлу.
  • media — Определяет устройство, для которого следует применять стилевое оформление.
  • rel — Определяет отношения между текущим документом и файлом, на который делается ссылка.
  • sizes — Указывает размер иконок для визуального отображения.
  • type — MIME-тип данных подключаемого файла.

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

href

Путь к файлу, на который делается ссылка.

Синтаксис

    <link href="<адрес>">

Значения

В качестве значения принимается полный или относительный путь к файлу.

Значение по умолчанию

Нет.

media

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

Синтаксис

    <link media="all | print | screen | speech">

Значения

  • all - Все устройства.
  • print - Печатающее устройство вроде принтера.
  • screen - Экран монитора.
  • speech - Речевые синтезаторы, а также программы для воспроизведения текста вслух. Сюда же входят речевые браузеры.

В HTML5 в качестве значений могут быть указаны медиа-запросы.

Значение по умолчанию

all

rel

Атрибут rel определяет отношения между текущим документом и файлом, на который делается ссылка. Это необходимо, чтобы браузер знал, как использовать подключаемый документ.

Синтаксис

    <link rel="<тип>">

Значения

  • alternate - Альтернативный тип, используется, к примеру, для указания ссылки на файл в формате XML для описания ленты новостей, анонсов статей.
  • author - Указывает ссылку на автора текущего документа или статьи.
  • help - Указывает ссылку на контекстно-зависимую справку.
  • icon - Адрес картинки, которая символизирует текущий документ или сайт.
  • license - Сообщает, что основное содержание текущего документа распространяется по лицензии, описанной в указанном документе.
  • next - Сообщает, что текущий документ является частью связанных между собой документов, а ссылка указывает на следующий документ.
  • prefetch - Указывает на предварительно кэшированный ресурс текущей страницы или сайта целиком.
  • prev - Сообщает, что текущий документ является частью связанных между собой документов, а ссылка указывает на предыдущий документ.
  • search - Указывает ссылку на ресурс, который применяется для поиска по документу или сайту.
  • stylesheet - Определяет, что подключаемый файл хранит таблицу стилей (CSS).

Значение по умолчанию

Нет.

sizes

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

Синтаксис

<link rel="icon" sizes="<ширина>X<высота>">
<link rel="icon" sizes="<ширина1>X<высота1> <ширина2>X<высота2>* | any">

Значения

Вначале указывается ширина иконки в пикселах без указания единиц (например, 16), затем пишется латинская буква x в верхнем (X) или нижнем регистре (x), после чего идёт высота иконки. Если в файле хранится сразу несколько иконок, можно задавать их размеры через пробел. Ключевое слово any указывает, что иконка может масштабироваться в любой размер, к примеру, если она хранится в векторном формате SVG.

Значение по умолчанию

Нет.

type

Сообщает браузеру, какой MIME-тип данных используется для внешнего документа. Как правило, применяется для того, чтобы указать, что подключаемый файл содержит CSS.

Синтаксис

    <link type="<MIME-тип>">

Значения

Имя MIME-типа в любом регистре. Для подключаемых таблиц связанных стилей применяется тип text/css.

Значение по умолчанию

text/css

Спецификации

Примеры

<!DOCTYPE HTML>
<html>
    <head>
        <meta charset="utf-8">
        <title>LINK</title>  
        <link rel="stylesheet" href="ie.css">
        <link rel="alternate" type="application/rss+xml" title="Статьи с сайта xsltdev.ru" href="http://xsltdev.ru/rss.xml"> 
        <link rel="shortcut icon" href="http://xsltdev.ru/favicon.ico">
    </head> 
    <body>
        <p>...</p>
    </body>
</html>