Перейти к содержанию

<link>

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

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

Демо

Метаданные документа

Синтаксис

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

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

Атрибуты

href

Путь к связываемому файлу.

media

Определяет устройство, для которого следует применять стилевое оформление.

rel

Определяет отношения между текущим документом и файлом, на который делается ссылка.

sizes

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

type

MIME-тип данных подключаемого файла.

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

href

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

Синтаксис

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

Значения

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

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

Нет.

media

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

Синтаксис

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

Значения

all

Все устройства.

print

Печатающее устройство вроде принтера.

screen

Экран монитора.

speech

Речевые синтезаторы, а также программы для воспроизведения текста вслух. Сюда же входят речевые браузеры.

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

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

all

rel

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

Синтаксис

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

Значения

alternate

Альтернативный тип, используется, к примеру, для указания ссылки на файл в формате XML для описания ленты новостей, анонсов статей.

author

Указывает ссылку на автора текущего документа или статьи.

help

Указывает ссылку на контекстно-зависимую справку.

icon

Адрес картинки, которая символизирует текущий документ или сайт.

license

Сообщает, что основное содержание текущего документа распространяется по лицензии, описанной в указанном документе.

next

Сообщает, что текущий документ является частью связанных между собой документов, а ссылка указывает на следующий документ.

prefetch

Указывает на предварительно кэшированный ресурс текущей страницы или сайта целиком.

prev

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

search

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

stylesheet

Определяет, что подключаемый файл хранит таблицу стилей (CSS).

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

Нет.

sizes

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

Синтаксис

1
2
3
4
5
<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.

Синтаксис

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

Значения

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

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

text/css

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

Описание и примеры

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
<!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="https://xsltdev.ru/rss.xml"
        />
        <link
            rel="shortcut icon"
            href="https://xsltdev.ru/favicon.ico"
        />
    </head>
    <body>
        <p>...</p>
    </body>
</html>

Ссылки

Комментарии