Что такое link в html
Перейти к содержимому

Что такое link в html

  • автор:

HTML тег

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

Синтаксис

В XHTML закрывающий тег () обязателен.

Пример

html> html> head> link rel="stylesheet" type="text/css" href="style.css"> head> body> h1>Внешний вид заголовка определяют CSS стили, указанные во внешнем файле. h1> p>Внешний вид абзаца определяют CSS стили, указанные во внешнем файле p> body> html>

Результат

linkexample1

Атрибуты

Атрибут Значение Описание
charset char_encoding Определяет кодировку связанного документа.
Не поддерживается в HTML5.
href URL Указывает местоположение внешнего файла.
hreflang language_code Определяет язык текста связанного документа.
media media_query Определяет устройство, для которого будут применены стили.
rel alternate
archives
author
bookmark
external
first
help
icon
last
license
next
nofollow
noreferrer
pingback
prefetch
prev
search
sidebar
stylesheet
tag
up
Определяет отношения между текущим документом и файлом, на который делается ссылка.
rev reversed relationship Определяет отношение между текущим и связанным документами.
Не поддерживается в HTML5.
sizes HeightxWeight Устанавливает размер связанных иконок. Используется только с rel = «icon».
target Указывает, как должна открываться ссылка.
Не поддерживается в HTML5.
_blank — в новом окне
_self — в текущем окне
_top — во всю ширину окна
_parent -в родительском фрейме
frame_name — во фрейме
type media_type Указывает MIME-тип (спецификация для передачи по сети файлов различного типа) связанного документа.

Тег HTML подключение внешнего файла, ресурса

Тег в HTML используется для связи текущего документа (страницы) с внешним ресурсом.

Чаще всего HTML тег используют для подключения каскадных таблиц стилей CSS.

Синтаксис

Основные вариации тега link

Ниже представлены распространенные случаи использования тега .

Подключение внешнего файла таблиц стилей CSS

Наиболее употребляемый вариант тега link — подключение к HTML документу файла стилей CSS. Для этого используются атрибуты rel=»stylesheet» и type=»text/css» .

Подробнее о способах подключения таблиц стилей CSS читайте в статье: Подключение стилей CSS к HTML документу. Как подключить CSS файл.

Подключение иконки документа favicon

С помощью конструкции ниже, подключается иконка (favicon, фавикон), которая будет выведена в заголовке вкладки возле названия документа (страницы).

Указание альтернативной версии HTML документа

Часто используется для указания иноязычной версии документа (версии страницы на другом языке). Для этого используется атрибут тега rel=»alternate» и hreflang=»код_языка» .

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

Тег link в коде HTML страницы

Поддержка браузерами

Тег Google Chrome Internet Explorer Mozilla FireFox Safari Opera
Да Да Да Да Да

Атрибуты тега

Определяет как будут обрабатываться запросы, использующие CORS .

  • anonymous — без отправки учетных данных;
  • use-credentials — с отправкой учетных данных.

Обязательный атрибут. Определяет отношение текущего ресурса к прикрепленному (чем является прикрепленный ресурс для текущего).

  • alternate — альтернативная версия документа. Например, страница на другом языке, версия страницы для печати, зеркало;
  • author — ссылка на автора страницы;
  • dns-prefetch — предварительная конвертация домена связанного файла в IP через DNS (ускоряет дальнейшую загрузку подключаемого файла);
  • help — ссылка на справку;
  • icon — подключение иконки документа. Иконка обычно выводится возле названия страницы в списке вкладок;
  • license — ссылка на документ, содержащий правовую информацию о текущем документе;
  • next — следующий документ (для документов, объединенных в последовательность);
  • pingback — адрес ресурса, отвечающего за обработку pingback текущего документа;
  • preconnect — предварительная установка TCP, TLS связи со связанным файлом (ускоряет дальнейшую загрузку подключаемого файла);
  • prefetch — предварительная загрузка файла с дальнейшим кешированием с низким приоритетом. Позволяет не ждать загрузки файла в момент первого использования;
  • preload — предварительная загрузка файла. Позволяет не ждать загрузки файла в момент первого использования файла;
  • prerender — предварительная загрузка и рендер. Браузер предварительно загрузит страницу по ссылке и подключенные к ней файлы, построит DOM дерево. При дальнейшем переходе на эту страницу, она загрузится (будет доступна) моментально;
  • prev — предыдущий документ (для документов, объединенных в последовательность);
  • search — ссылка на ресурс, способный выполнить поиск по текущему документу;
  • stylesheet — подключение каскадных таблиц стилей CSS.

Указывает размер прикрепляемых иконок.

Формат: значение ширины в пикселях, латинская буква «x» (большая или маленькая), значение высоты в пикселях. Можно указывать несколько размеров через пробел.

Для масштабируемых иконок используется значение «any».

Определяет тип содержимого тега.

Для подключения таблиц стилей используется значение: «text/css».

Устаревшие атрибуты

alternate
author
dns-prefetch
help
icon
license
next
pingback
preconnect
prefetch
preload
prerender
prev
search
stylesheet

Определяет отношение прикрепленного ресурса к текущему (чем является текущий ресурс для прикрепленного).

Смотрите расшифровку значений выше, в описании атрибута «rel».

Определяет где будет открыт связанный ресурс:

  • _blank — в новой вкладке или окне;
  • _parent — в родительском окне;
  • _self — в текущем окне (используется по умолчанию);
  • _top — на весь экран.

by Lebedev

Поделиться в Facebook Поделиться в ВКонтакте Поделиться в Одноклассники Поделиться в Twitter

Оцените, насколько полезна эта страница
Эти материалы могут быть вам полезны

Подключение стилей CSS к HTML документу. Как подключить CSS файлТег HTML встроенные стили CSSСписки в HTML. Все о HTML спискахТеги форматирования текста в HTMLСоздание таблиц в HTML. Все о HTML таблицахТег HTML раздел заголовковТег HTML область контента

HTML тег link

Тег определяет ссылку на внешний ресурс. Наиболее часто этот тег используется для подключения файла стилей CSS к документу HTML.

Использование тега для подключения внешнего файла стилей CSS поддерживается всеми основными браузерами. Ничего другое в настоящее время не поддерживается.

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

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

Разница между HTML 4.01 и HTML5

Некоторые атрибуты, допустимые в HTML 4.01, не поддерживаются в HTML5.

В HTML5 был добавлен атрибут sizes.

Различия между HTML и XHTML

В HTML тег — одиночный элемент без закрывающего тега. В XHTML тег необходимо закрывать должным образом, а именно — .

Атрибуты тега

Атрибут Описание
charset Определяет кодировку символов подключаемого документа
href Определяет URL подключаемого внешнего ресурса
hreflang Определяет язык подключаемого внешнего документа
media Определяет устройства вывода, для которых оптимизирован внешний ресурс
rel Определяет отношение между текущим и подключаемым внешним документом/ресурсом
rev Определяет отношение с подключаемым документом/ресурсом
sizes Определяет размер иконки
target Определяет, куда будет загружаться подключаемый документ
type Определяет медиа-тип подключаемого документа
Общие атрибуты
CSS стили по умолчанию

Большинство браузеров будут отображать тег со следующими стилями

 link
HTML пример использования

Подключение внешнего файла стилей:

Что такое link в html

Устанавливает связь с внешним документом вроде файла со стилями или со шрифтами. В отличие от тега , тег размещается всегда внутри контейнера и не создает ссылку.

Синтаксис

Атрибуты

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

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

Закрывающий тег

HTML5 IE Cr Op Sa Fx

    Тег LINK    

.

В данном примере подключается внешний файл со стилями с помощью атрибута rel=»stylesheet» тега , указывается RSS-документ текущего сайта ( link rel=»alternate» type=»application/rss+xml» ) и устанавливается иконка сайта в адресной строке браузера ( link rel=»shortcut icon» ).

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *