отзывы

Восстановление
пароля

Готово

Назад

Основы программирования
Успеха достигает тот, кто способен на время отодвинуть свои увлечения
Программист - профессия будущего!

<link>

  • 153

  • 0

  • Нравится

    0

  • Код:856941727794

HTML тег
Задайте вопрос продавцу

<link>

грн. / шт.

Компания: Уроки программирования
Телефон: +38(093)43-03-164
Адрес: Киевская область г. Киев, с. Красное
Оставьте свой номер
<link>

грн. / шт.

Оставьте свой номер телефона и представитель компании с вами свяжется.

     HTML тег <link>

Описание

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

Синтаксис

HTML
<head>
  <link атрибуты>
</head>
XHTML
<head>
  <link атрибуты />
</head>

 

Атрибуты

charset

Кодировка связываемого документа.

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

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

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

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

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

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

 

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

Не требуется.

 

<!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="Статьи с сайта htmlbook.ru" href="http://...ru/rss.xml"> 
   <link rel="shortcut icon" href="http://../favicon.ico">
  </head> 
  <body>
    <p>...</p>
  </body>
</html>

 

Первый атрибут href определяет адрес документа, который может быть как абсолютным так и относительным. Второй атрибут rel указывает связь между HTML файлом и тем, на что вы ссылаетесь, в данном случае мы ссылаемся на таблицу стилей, поэтому используется значение stylesheet. Атрибут type сообщает браузеру MIME тип документа, для таблиц стилей значением всегда будет "text/css".

Примечание: по стандарту HTML5, при подключении к документу внешнего файла CSS, атрибут type указывать не требуется:
1
<link href="style.css" rel="stylesheet">

Предварительная загрузка страниц

Обычно, когда вы кликаете по ссылке на другую страницу приходится ждать несколько секунд пока она загрузится. Однако, вы можете настроить вашу веб-страницу таким образом, чтобы определённые страницы загружались заранее в кэш браузера в то время пока вы находитесь на текущей странице. Это означает, что когда вы кликнете по ссылке для перехода на другую веб-страницу, то она откроется сразу и не надо будет ждать, пока она загрузится. Это называется "предварительное получение страницы". Чтобы сделать это, используется тег <link> с атрибутом rel="prefetch", а также указывается целевая страница, которая будет заранее загружена на компьютер.

1
<link rel="prefetch" href="httр://www.../html/tag_p.php">

Такая запись позволит заранее закешировать страницу tag_p.php на компьютере, пока вы читаете содержимое текущей страницы. Вы можете использовать тег <link> для предварительной загрузки любого количества страниц вашего собственного сайта или любых других из интернета.

Примечание: вместо адреса на HTML-документ можно указать путь к файлу другого типа (картинку, видео и тд.).

Атрибуты

href:

Указывает месторасположение (URL) внешнего файла (путь к файлу может быть указан с помощью абсолютного или относительного адреса).

hreflang:

Указывает двухбуквенный код языка, определяющий язык документа, на который ведет ссылка. Атрибут hreflang используется только совместно с атрибутом href.

media:

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

rel:

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

  • alternate - ссылка на альтернативную версию документа (то есть страницы для печати, перевод или зеркало).
  • author - определяет ссылку страницу об авторе документа или на страницу с контактными данными автора.
  • canonical - позволяет пометить страницы с дублирующимся контентом, это значит что все страницы, имеющие одинаковое содержимое должны содержать тег <link> с атрибутом rel="canonical".

    Атрибут href, в этом случае, должен содержать ссылку на страницу с идентичным содержимым, которую поисковые системы должны считать основной:
    1
    <link rel="canonical" href="httр://www.,/html/tag_p.php">
  • first - указывает ссылку, ведущую на первый документ из последовательности документов.
  • help - ссылка на документ со справкой.
  • icon - определяет путь к иконке, которая будет использована для текущего документа.
  • last - указывает ссылку, ведущую на последний документ в последовательности документов.
  • licence - ссылка на сведения об авторских правах для документа.
  • next - указывает, что этот документ является частью серии, и что ссылка будет вести на следующий документ в этой серии.
  • prefetch - указывает, что следует заранее кэшировать файл, на который ведет ссылка.
  • prev - указывает, что этот документ является частью серии, и что ссылка ведет на предыдущий документ в этой серии.
  • search - ссылка на поиск для документа.
  • stylesheet - определяет внешний файл, который будет использоваться в качестве таблицы стилей для данного документа.

sizes:

Указывает размер иконок для визуального отображения. Атрибут sizes используется только совместно с rel="icon", может принимать следующий значения:

  • ширинаXвысота - определяет список размеров, разделенных пробелами, каждый размер должен быть в формате - ширинаxвысота (размеры иконки определяются в пикселях), пример:
    1
    <link rel="icon" href="favicon.png" sizes="16x16 32x32" type="image/png">
  • any - иконка может масштабироваться до любого размера.

type:

Указывает MIME-тип (спецификация форматирования сообщений и кодирования информации для передачи по интернету) документа, на который ведет ссылка, используется только совместно с атрибутом href.

 

 

Типы ссылок

Существует много типов ресурсов, на которые может ссылаться документ. Это делается с помощью ключевых слов, указанных в атрибуте отношения (rel). Они должны использоваться в разделе <head> как метаданные:

  • alternate;
  • author;
  • help;
  • icon;
  • license;
  • next;
  • prefetch;
  • prev;
  • search;
  • stylesheet.

Тег <link> в HTML размещается в <head> и <body>, хотя чаще он встречается в <head> в качестве метаданных. Тег <link> может ссылаться на традиционную гиперссылку, используемую для навигации или присоединения к документу внешних ресурсов, таких как CSS и Javascript.

 

 

Alternate

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

В приведенном ниже примере представлены два альтернативных языка для данного документа HTML на английском - французский и испанский языки. Атрибут hreflang используется, чтобы сообщить пользовательскому агенту доступный код страны по стандарту ISO 639-1:

 

 

<!DOCTYPE html>
<html>
	<head>
		<link rel="stylesheet" href="style1.css">
		<link rel="stylesheet" href="style2.css" media="screen">
		<link href="favicon.ico" rel="shortcut icon" type="image/x-icon">
		<meta charset="utf-8">
		<title>Это заголовок тайтл</title>
	</head>
	<body>
		Это основное содержимое страницы.
	</body>
</html>

 

Необязательные атрибуты

Атрибут Значение Описание
charset char_кодировка Определяет кодировку документа, на который идет ссылка
href URL Определяет расположения документа, на который идет ссылка
hreflang код_языка Определяет язык текста в документе, на который идет ссылка
media screen tty tv projection handheld print braille aural all Определяет на каком приборе будет показан документ, на который идет ссылка
rel alternate appendix bookmark chapter contents copyright glossary help home index next prev section start stylesheet subsection Определяет отношение между текущим документом и документом , на который идет ссылка
rev alternate appendix bookmark chapter contents copyright glossary help home index next prev section start stylesheet subsection Определяет отношение документом, на который идет ссылка, и текущим документом
target _blank _self _top _parent название_фрейма Определяет в каком окне будет открыт документ, на который идет ссылка
type MIME_тип Определяет тип MIME документа, на который идет ссылка

 

Стандартные атрибуты

Атрибут Значение Описание
class имя_класса Определяет имя класса для элемента
dir rtl ltr Определяет направление текста для контента в элементе
id id Определяет уникальный id для элемента
lang код_языка Определяет код языка для контента в элементе
style определение_стиля Определяет инлайновый стиль для элемента
title текст Определяет дополнительную информацию об элементе
xml:lang код_языка Определяет код языка для контента в элементе, в XHTML документах

 

Событийные атрибуты

Атрибут Значение Описание
onclick скрипт Скрипт будет выполнен при клике
ondblclick скрипт Скрипт будет выполнен при двойном клике
onfocus скрипт Скрипт будет выполнен при получения фокуса
onmousedown скрипт Скрипт будет выполнен при нажатии кнопки мышки
onmousemove скрипт Скрипт будет выполнен при движении курсора мышки
onmouseout скрипт Скрипт будет выполнен, когда курсор мышки покинет пределы элемента
onmouseover скрипт Скрипт будет выполнен, когда курсор мышки находится над элементом
onmouseup скрипт Скрипт будет выполнен, когда кнопка мышки будет отпушена
onkeydown скрипт Скрипт будет выполнен при нажатии клавиши
onkeypress скрипт Скрипт будет выполнен при нажатии клавиши и последующего разжатия
onkeyup скрипт Скрипт будет выполнен при разжатии клавиши

 

Ниже представлен набор элементов link, содержащих ссылки на несколько таблиц стилей:

01 <!-- a persistent style sheet -->
02 <link rel="stylesheet" href="default.css">
03  
04 <!-- the preferred alternate style sheet -->
05 <link rel="stylesheet" href="green.css" title="Green styles">
06  
07 <!-- some alternate style sheets -->
08 <link rel="alternate stylesheet" href="contrast.css" title="High contrast">
09 <link rel="alternate stylesheet" href="big.css" title="Big fonts">
10 <link rel="alternate stylesheet" href="wide.css" title="Wide screen">

В следующем примере показано, как можно указать версии страницы, используя альтернативные форматы, предназначенные для других языков и других медиатипов:

1 <link rel=alternate href="/en/html" hreflang=en type=text/html title="English HTML">
2 <link rel=alternate href="/fr/html" hreflang=fr type=text/html title="French HTML">
3 <link rel=alternate href="/en/html/print" hreflang=en type=text/html media=print title="English HTML (for printing)">
4 <link rel=alternate href="/fr/html/print" hreflang=fr type=text/html media=print title="French HTML (for printing)">
5 <link rel=alternate href="/en/pdf" hreflang=en type=application/pdf title="English PDF">
6 <link rel=alternate href="/fr/pdf" hreflang=fr type=application/pdf title="French PDF">

Атрибуты и значения

  • rel="stylesheet" – указывает тип связи между документом и отдаленным источником.
  • href="../style.css" – указывает url источника.
  • type="text/css" – указывает тип внешнего источника (файла).

     

Отзывов нет

Публикация отзыва производится после предварительной модерации

Отправить

Случайные статьи