Содержание

Атрибут rel | htmlbook.ru


Internet Explorer Chrome Opera Safari Firefox Android iOS
3.0+ 1.0+ 4.0+ 1.0+ 1.0+ 1.0+ 1.0+

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

HTML: 3.2 4.01 5.0 XHTML: 1.0 1.1

Описание

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

Синтаксис

HTML
<link rel="тип">
XHTML
<link rel="тип" />

Значения

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

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

Нет.

Пример

HTML5IECrOpSaFx

<!DOCTYPE HTML>
<html>
  <head>
   <meta charset="utf-8">
   <title>Тег LINK, атрибут rel</title> 
   <link rel="stylesheet" href="hb.css">
  </head> 
  <body>
   <p>...</p>
  </body>
</html>

Статьи по теме

Не выкладывайте свой код напрямую в комментариях, он отображается некорректно. Воспользуйтесь сервисом cssdeck.com или jsfiddle.net, сохраните код и в комментариях дайте на него ссылку. Так и результат сразу увидят.

Тег | htmlbook.ru

Internet Explorer
Chrome Opera Safari Firefox Android iOS
3.0+ 1.0+ 4.0+ 1.0+ 1.0+ 1.0+ 1.0+

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

HTML: 3.2 4.01 5.0 XHTML: 1.0 1.1

Описание

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

Синтаксис

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

Атрибуты

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

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

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

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

Пример

HTML5IECrOpSaFx

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

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

Тег link — подключение CSS, фавикона и других внешних файлов

Тег link подключает CSS файлы на HTML страницу. Кроме того, link подключает некоторые другие файлы, например, фавикон. (

Фавикон — это ярлычок сайта, который виден во вкладке браузера. Его также можно увидеть в некоторых поисковиках при поиске напротив сайтов, например в Яндексе).

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

Как подключить CSS в HTML5: <link rel=»stylesheet» href=»style.css»>. В более ранних версиях нужно было добавлять атрибут type в значении text/css. В HTML5 так тоже можно делать, но это не обязательно.

Как подключить фавикон: <link href=»favicon.ico» rel=»shortcut icon» type=»image/x-icon»>.

Тег link не требует закрывающего тега.

Атрибуты

Атрибут Описание
href Путь к подключаемому файлу.
media Тип устройства, для которого следует подключить файл.
Что имеется ввиду — вы можете подключить CSS файл только для больших экранов (значение screen) или только для маленьких экранов: для мобильников или планшетов (значение handheld).
Возможные значения: all, braille, handheld, print, screen, speech, projection, tty, tv. Подробнее смотрите ниже.
rel Тип подключаемого файла. Возможные значения: stylesheet | alternate. Значение stylesheet указывает на то, что подключается CSS файл, значение alternate используется, к примеру, для указания ссылки на файл в формате XML для описания ленты новостей, анонсов статей.
charset Кодировка подключаемого файла. В настоящее время стандартом является
utf-8
.
type Тип данных подключаемого файла. Для CSS следует использовать text/css, для фавикона: image/x-icon.

Значения атрибута media

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

Значение Описание
all Все устройства.
screen Экран монитора.
handheld Телефоны, смартфоны, устройства с маленьким экраном.
braille Устройства, основанные на системе Брайля, предназначены для слепых людей.
speech Речевые синтезаторы, а также программы для воспроизведения текста вслух. Сюда же входят речевые браузеры.
print Принтеры.
projection Проекторы.
tty Телетайпы, терминалы, портативные устройства с ограниченными возможностями экрана. Для них не должны использоваться пиксели в качестве единиц измерения.
tty Телевизоры, которые умеют открывать web страницы (бывает и такое).

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

Пример

Давайте посмотрим, как выглядит структура простейшей html страницы, к которой добавим подключение CSS файлов и фавикона:

<!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>

Смотрите также

  • тег style,
    который добавляет CSS прямо на странице
  • атрибут style, который задает стили конкретному тегу

Тег | HTML справочник

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

Описание

HTML тег <link> определяет отношение между текущим html-документом и внешним ресурсом, на который он ссылается. Он является пустым элементом (не имеет содержимого и закрывающего тега) и всегда должен располагаться внутри элемента <head>. Чаще всего тег <link> используется для подключения внешних таблиц стилей:


<link href="style.css" rel="stylesheet" type="text/css">

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

Примечание: по стандарту HTML5, при подключении к документу внешнего файла CSS, атрибут type указывать не требуется:

<link href="style.css" rel="stylesheet">

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

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

<link> с атрибутом rel="prefetch", а также указывается целевая страница, которая будет заранее загружена на компьютер.

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

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

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

Атрибуты

href:
Указывает месторасположение (URL) внешнего файла (путь к файлу может быть указан с помощью абсолютного или относительного адреса).
hreflang:
Указывает двухбуквенный код языка, определяющий язык документа, на который ведет ссылка. Атрибут hreflang используется только совместно с атрибутом href.
media:
Определяет под какие устройства оптимизирован файл. Главным образом он используется с файлами таблиц стилей, для определения различных стилей под разные типы носителей. Атрибут media может принимать сразу несколько значений, разделяемых между собой пробелами.
rel:
Указывает связь между текущим документом и документом, на который ведет ссылка.
  • alternate — ссылка на альтернативную версию документа (то есть страницы для печати, перевод или зеркало).
  • author — определяет ссылку страницу об авторе документа или на страницу с контактными данными автора.
  • canonical — позволяет пометить страницы с дублирующимся контентом, это значит что все страницы, имеющие одинаковое содержимое должны содержать тег <link> с атрибутом rel="canonical".

    Атрибут href, в этом случае, должен содержать ссылку на страницу с идентичным содержимым, которую поисковые системы должны считать основной:

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

Тег <link> так же поддерживает Глобальные атрибуты

Стиль по умолчанию


link {
    display: none;
}  

Пример


<head>
  <link rel="stylesheet" href="style.css">
</head> 

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

Пример использования тега <link>

Атрибут rel | HTML | WebReference

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

Значения

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

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

Пример

<!DOCTYPE HTML> <html> <head> <meta charset=»utf-8″> <title>LINK, атрибут rel</title> <link rel=»stylesheet» href=»hb.css»> </head> <body> <p>…</p> </body> </html>

Браузеры

В таблице браузеров применяются следующие обозначения.

  •  — элемент полностью поддерживается браузером;
  •  — элемент браузером не воспринимается и игнорируется;
  •  — при работе возможно появление различных ошибок, либо элемент поддерживается с оговорками.

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

Автор и редакторы

Автор: Влад Мержевич

Последнее изменение: 24.05.2018

Редакторы: Влад Мержевич

Как научиться разрабатывать сайты

HTML: тег link | HTML/xHTML


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

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

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

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

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

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

<head>
  <link rel="alternate" hreflang="fr" type="text/html" href="http://www.site.com/lang/fr/html/this-doc.html"/>
  <link rel="alternate" hreflang="es" type="text/html" href="http://www.site.com/lang/es/html/this-doc.html"/>
</head>

Еще один пример использования HTML link rel предлагает три различных текстовых документа на английском, французском и испанском языках:

<head>
  <link rel="alternate" hreflang="en" type="application/msword" href="http://www.site.com/lang/en/msword/this-doc.doc"/>
  <link rel="alternate" hreflang="fr" type="application/msword" href="http://www.site.com/lang/fr/msword/this-doc.doc"/>
  <link rel="alternate" hreflang="es" type="application/msword" href="http://www.site.com/lang/es/msword/this-doc.doc"/>
</head>

Используется для получения информации об авторе. Как правило, гиперссылка ведет на страницу автора. В данном атрибуте тега может быть указан только один автор:

<head>
  <link rel="author" href="http://www.site.com/the-author-bio"/>
</head>

Если имеется много авторов, связанных с HTML-страницей, нужно применить несколько тегов link HTML:

<head>
  <link rel="author" href="http://www.site1.com/the-author-bio"/>
  <link rel="author" href="http://www.site2.com/the-author-bio"/>
  <link rel="author" href="http://www.site3.com/the-author-bio"/>
</head>

В завершении можно добавить метатег author:

<head>
  <meta name="author" content="Статья написана Joe Smith, Harry Paul, Samantha Lang">
</head>

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

<head>
  <link rel="help" href="http://www.site.com/category/article-title/help.html"/>
</head>

Это значение HTML link rel указывает на иконку страницы. Может быть множество иконок, представляющих страницу. Используется та, которая является наиболее подходящей:

<head>
  <link rel="icon" type="image/png" href="http://www.site.com/icons/favicon.png"/>
  <link rel="icon" type="image/jpeg" href="http://www.site.com/icons/apple.jpg"/>
  <link rel="icon" type="image/gif" href="http://www.site.com/icons/msoft.gif"/>
  <link rel="icon" type="image/png" href="http://www.site.com/icons/android.png"/>
</head>

Это условия лицензии авторских прав на документ. Можно использовать лицензию на весь сайт или лицензию, имеющую отношение к конкретному документу:

<head>
  <link rel="license" type="text/html" href="http://www.site.com/legal/sitewide.html"/>
  <link rel="license" type="text/html" href="http://www.site.com/legal/item-100.html"/>
</head>

Указывает на следующую страницу в HTML-документе. Для поисковых систем весьма полезно знать, какая страница является следующей:

<head>
  <link rel="next" href="http://www.site.com/article-title/2"/>
</head>

Это значение HTML link rel дает подсказку пользовательскому агенту о том, что он должен кэшировать ресурс для ускорения загрузки и обработки. Это делается, когда разработчик точно знает, что ресурсы, используемые на странице, будут запрашиваться:

<head>
  <link rel="prefetch" href="http://www.site.com/fonts/myfonts"/>
  <link rel="prefetch" href="http://www.site.com/images/mylogo.jpg"/>
  <link rel="prefetch" href="http://www.site.com/article-title/1"/>
  <link rel="prefetch" href="http://www.site.com/article-title/3"/>
</head>

Определяет предыдущую страницу в HTML-документе. Полезно для навигации по страницам:

<head>
  <link rel="prev" href="http://www.site.com/article-title/1"/>
</head>

Определяет документ, который используется для поиска существующего документа. Как правило, это страница со специальной формой для поиска ключевых слов в документе. Для реализации рекомендуется использовать спецификацию OpenSearch:

<head>
  <link rel="search" href="http://www.site.com/search/search.html"/>
</head>

HTML link CSS используется для импорта таблицы стилей, используемой для отображения документа. Это делается с помощью каскадных таблиц стилей (CSS):

<head>
  <link rel="stylesheet" type="text/css" href="http://www.site.com/css/styles.css"/>
</head>

Данная публикация представляет собой перевод статьи «HTML: The Link Tag» , подготовленной дружной командой проекта Интернет-технологии.ру

улучшаем семантику ссылок / Хабр

Примечание: ниже перевод статьи «Boost Your Hyperlink Power». В ней освещается использование атрибутов rel и rev, а также некоторые микроформаты.

Часть HTML-тегов и атрибуты мы используем каждый день в свой работе. Заголовки, параграфы, списки и картинки являются основой разметки каждого веб-разработчика. Но наиболее распространенным элементом, наверное, будет ссылка — простой тег, который связывает воедино все страницы, создавая ту самую беспорядочную структуру, которую мы называем Всемирная Сеть Интернет (WWW).

Ссылка как она есть

Весь потенциал ссылок заключается в атрибуте href, сокращение от hypertext reference. Он создает одностороннюю связь текущей страницы с другим ресурсом, обычно другой такой же страницей в интернете:


   <a href="http://allinthehead.com/">

Атрибут href находится в открывающем теге a, между открывающим и закрывающим тегами находится текст для описания ссылки:


   <a href="http://allinthehead.com/">Drew McLellan</a>

«Ну и что», — скажите вы. — «Это я все и так знаю», — и будете абсолютно правы! Но у ссылки есть еще кое-что, кроме атрибута href.

Теория относительности (relativity)

Может быть, вы уже читали про атрибут rel у ссылки. Я готов поспорить, что в секции head ваших страниц будет располагаться что-нибудь типа этого:


   <link rel="stylesheet" type="text/css" media="screen" href="styles.css" />

Атрибут rel описывает связь между текущим документом и тем, на который он указывает. В этом случае, значением атрибута rel является stylesheet. Это означает, что связанный документ является таблицей стилей для текущего: между ними именно такая связь.

Еще одно распространенное употребление rel:


   <link rel="alternate" type="application/rss+xml" title="Моя RSS-лента" 
   href="index.xml" />

В данном случае связь между текущим документом и связанным — RSS-лентой — указана как alternate: альтернативное преставление текущего документа.

Оба этих примера используют тег link, но вы можете использовать атрибут rel и у обычных ссылок. Например, мы ссылаетесь на вашу RSS-ленту из секции :


   Подпишитесь на <a href="index.xml">мою RSS-ленту</a>.

Вы можете добавить дополнительную информацию к этой ссылке, используя атрибут rel:


   Подпишитесь на <a href="index.xml" rel="alternate" 
   type="application/rss+xml">мою RSS-ленту</a>.

Не существует определенного списка значений для атрибута rel, поэтому вы можете использовать все, что посчитаете семантически разумным. Например, если у вас сложное коммерческое веб-приложение, в котором присутствует ссылка на подсказку, то вы можете определить связь между текущей страницей и этой подсказкой, используя значение help:


   <a href="help.html" rel="help">нужна подсказка?</a>

Элементарные микроформаты

Хотя вы абсолютно свободны в использовании значений атрибута rel, существует уже некоторые общепринятые значения при использовании микроформатов. Некоторые из простейших микроформатов предлагают варианты грамотного использования rel. Например, если вы ссылаетесь на лицензию, под которой опубликован данный документ, используйте микроформат rel-license:


   Распространяется под лицензией <a href="http://creativecommons.org/licenses/by/2.0/" 
   rel="license">Creative Commons</a>

Эта конструкция описывает, что текущая страница ссылается на документ, помеченный как «лицензия».

Микроформат rel-tag идет немного дальше. Он используется для указания на то, что последняя часть URL’а у ссылки является «меткой» для текущего документа:


   Прочитайте про <a href="http://en.wikipedia.org/wiki/Microformats" 
   rel="tag">семантическую верстку</a>

В данном случае для этого документа добавлена метка «Microformats».

XFN (XHTML Friends Network) является способом описания отношений между людьми:


   <a href="http://allinthehead.com/" rel="friend">Drew McLellan</a>

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


   <a href="http://allinthehead.com/" rel="friend met colleague">Drew McLellan</a>

Таким образом я указываю, что Drew мой друг, я с ним встречался, и он мой коллега (ведь мы оба фанатеем от интернета (Web monkies)).

«Мы — хотим перемен» (revolution)

Если rel описывает связь между текущей страницей и той, на которую она ссылается, (прим.: текущая страница -> другая страница) то rev используется для обратной зависимости: он определяет вид связи страницы, на которую ссылаются, с текущей (прим.: текущая страница <- другая страница). Ниже приведен пример, который может быть использован в help.html:


   <a href="shoppingcart.html" rev="help">вернуться в магазин</a>

Атрибут rev указывает, что текущая страница является страницей помощи, подсказкой для той, на которую она ссылается.

Микроформат vote-links позволяет вам использовать атрибут rev для уточнения ваших ссылок. Например, определяя значение vote-for, вы можете указать, что ваш документ поддерживает тот, на который ссылается:


   Я согласен с <a href="http://richarddawkins.net/home" rev="vote-for">Richard Dawkins</a>.

Есть и соответствующее значение vote-against. Оно означает, что хоть вы и ссылаетесь на этот документ, но вы явно указываете, что с ним не согласны.


   Я согласен с <a href="http://richarddawkins.net/home" rev="vote-for">Richard Dawkins</a>

   по поводу <a href="http://www.icr.org/" rev="vote-against">креационистов</a>.

Естественно, ничего не мешает использовать в одной ссылке и rel, и rev:


   <a href="http://richarddawkins.net/home" rev="vote-for" rel="muse">Richard Dawkins</a>

Разумность большинства

За легкостью использования rel и rev скрывается богатый потенциал. Они позволяет относительно легко добавить в ваши ссылки больше семантического смысла, что создает связи, которые затем могут быть обработы поисковыми роботами, агрегаторами или браузерами. Пусть вашим следующим шагом станет тесное знакомство с этими атрибутами и расширение возможностей ссылок.

Сссылки по теме

Большое спасибо тем, кто прочитал всю статью полностью. Мне хотелось бы услышать ваше мнение или замечания по поводу использования rel/rev, в частности, или микроформатов вообще.

Web Optimizator: проверка скорости загрузки сайтов

Ссылка HTML rel Атрибут

❮ HTML <ссылка> тег

Пример

Внешняя таблица стилей:

Попробуй сам »

Определение и использование

Обязательный атрибут rel указывает отношение между текущим документом и связанным документом / ресурсом.


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

Атрибут
отн. Да Да Да Да Да

Синтаксис

Значения атрибута

Лицензия . .
Значение Описание
альтернатива Предоставляет ссылку на альтернативную версию документа (i.е. распечатать страницу, переведенную или зеркальную).
Пример:
автор Предоставляет ссылку на автора документа
dns-prefetch Указывает, что браузер должен превентивно выполнять разрешение DNS для источника целевого ресурса.
, помощь Предоставляет ссылку на справочный документ.Пример:
значок Импортирует значок для представления документа.
Пример:
Предоставляет ссылку на информацию об авторских правах для документа
следующий Предоставляет ссылку на следующий документ в серии
пингбек Предоставляет адрес сервера пингбэка, который обрабатывает пингбэки к текущему документу
предварительное соединение Указывает, что браузер должен предварительно подключиться к источнику целевого ресурса.
предварительная выборка Указывает, что браузер должен предварительно извлекать и кэшировать целевой ресурс, так как это, вероятно, потребуется для последующей навигации
преднагрузка Указывает, что агент браузера должен предварительно извлекать и кэшировать целевой ресурс для текущей навигации в соответствии с пунктом назначения, заданным атрибутом «как» (и приоритетом, связанным с этим пунктом назначения).
prerender Указывает, что браузер должен предварительно отрендерить (загрузить) указанный веб-страница в фоновом режиме. Таким образом, если пользователь переходит на эту страницу, это ускоряет до загрузки страницы (потому что страница уже загружена). Предупреждение! Это трата пропускной способности пользователя! Используйте только prerender, если он абсолютно уверен что веб-страница требуется в какой-то момент в пути пользователя
пред Указывает, что документ является частью серии, и что предыдущий документ в серии является ссылочным документом
поиск Предоставляет ссылку на ресурс, который можно использовать для поиска по текущему документу и связанным с ним страницам.
таблиц стилей Импортирует таблицу стилей

Tag HTML тег ,

HTML-тег ссылки


Пример

Ссылка на внешнюю таблицу стилей:



Попробуй сам »

Определение и использование

Тег определяет Отношения между текущим документом и внешним ресурс.

Тег чаще всего используется для ссылки на внешние таблицы стилей.

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


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

При использовании для таблиц стилей тег поддерживается во всех основных браузерах. Никакой реальной поддержки ни для чего другого.

Элемент
<ссылка> да да да да да


атрибутов

Атрибут Значение Описание
перекрестное происхождение анонимные
учетные данные для использования
Указывает, как элемент обрабатывает перекрестные запросы
HREF URL Указывает расположение связанного документа
Hreflang language_code Указывает язык текста в связанном документе
СМИ media_query Указывает, на каком устройстве будет отображаться связанный документ.
справочная политика , без ссылки,
, без ссылки, при понижении рейтинга,
, происхождение,
. происхождение-когда-кросс-происхождение
unsafe-url
Указывает, какой реферер использовать при извлечении ресурса
отн. альтернатива
автор
dns-prefetch
help
значок
лицензия
следующий
Pingback
предварительно подключить
предварительная загрузка
предварительная загрузка
предварительная загрузка
пред
поиск
таблица стилей
Требуется.Определяет связь между текущим документом и связанным документом
размеры Высота x Ширина
любой
Определяет размер связанного ресурса. Только для rel = "icon"
заголовок Определяет предпочтительную или альтернативную таблицу стилей
тип media_type Указывает тип носителя связанного документа

Глобальные атрибуты

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


Атрибуты события

Тег также поддерживает атрибуты событий в HTML.


Связанные страницы

Учебник по HTML: стили HTML

HTML DOM ссылка: объект ссылки


Настройки CSS по умолчанию

В большинстве браузеров отображается элемент со следующими значениями по умолчанию:

ссылка {
дисплей: нет;
}


,

Типы ссылок — веб-технологии для разработчиков

альтернативный
  • Если элемент и атрибут rel также содержит тип таблицы стилей , ссылка определяет альтернативную таблицу стилей; в этом случае атрибут заголовка должен присутствовать, а не быть пустой строкой.
  • Если для типа установлено значение application / rss + xml или application / atom + xml , ссылка определяет канал распространения.Первый, определенный на странице, используется по умолчанию.
  • В противном случае ссылка определяет альтернативную страницу одного из следующих типов:
    • для другого носителя, например портативного устройства (если установлен атрибут media )
    • на другом языке (если установлен атрибут hreflang ),
    • в другом формате, например PDF (если установлен атрибут type )
    • комбинация этих
, <область> , <ссылка> <форма>
архивов Определяет гиперссылку на документ, который содержит архивную ссылку на этот документ.Например, запись в блоге может ссылаться на ежемесячную индексную страницу таким образом.

Примечание: Несмотря на то, что единый архив признан неверным, его следует избегать.

, <область> , <ссылка> <форма>
автор Определяет гиперссылку на страницу, описывающую автора или предоставляющую способ связаться с автором.

Примечание: Это может быть гиперссылка mailto: , но это не рекомендуется на общедоступных страницах, поскольку роботы-сборщики быстро приведут к большому количеству спама, отправленного на адрес. В этом случае лучше перейти на страницу с контактной формой.

Несмотря на то, что он распознается, атрибут rev для , или элементов с типом ссылки сделал неверным и должен быть заменен атрибутом rel с этот тип ссылки.

, <область> , <ссылка> <форма>
закладка Указывает, что гиперссылка является постоянной ссылкой для ближайшего предка
элемента. Если нет, это постоянная ссылка на раздел, с которым элемент наиболее тесно связан.

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

, <область> <ссылка> , <форма>
канонический Из Википедии, свободной энциклопедии: Canonical_link_element
Канонический элемент ссылки — это элемент HTML, который помогает веб-мастерам предотвращать проблемы с дублирующимся контентом, указывая «каноническую» или «предпочтительную» версию веб-страницы как часть поисковой оптимизации.
<ссылка> , <область> , <форма>
dns-prefetch Подсказывает браузеру, что ресурс необходим, позволяя браузеру выполнить поиск DNS и подтверждение связи по протоколу, прежде чем пользователь щелкнет ссылку. <ссылка> , <область> , <форма>
внешний Указывает, что гиперссылка ведет на ресурс за пределами сайта текущей страницы; то есть, переход по ссылке заставит пользователя покинуть сайт. , <область> , <форма> <ссылка>
первый Указывает, что гиперссылка ведет к первому ресурсу последовательности , в которой находится текущая страница.

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

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

, <область> , <ссылка> <форма>
помощь , <область> , <форма> , <ссылка> Нет.
icon Определяет ресурс для представления страницы в пользовательском интерфейсе, обычно значок (слуховой или визуальный).В браузере его обычно называют favicon.

Если имеется с, браузер использует их атрибуты media , type и size для выбора наиболее подходящего значка. Если несколько значков одинаково подходят, используется последний. Если впоследствии наиболее подходящий значок окажется неподходящим, например, потому что он использует неподдерживаемый формат, браузер переходит к следующему наиболее подходящему и т. Д.

Примечание: iOS от Apple не использует ни этот тип ссылки, ни атрибут размеров , как это делают другие мобильные браузеры, чтобы выбрать значок веб-страницы для Web Clip или начального заполнителя. Вместо этого он использует нестандартные apple-touch-icon и apple-touch-startup-image соответственно.

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

<ссылка> , <область> , <форма>
импорт HTML Импорт <ссылка> , <область> , <форма>
index Устаревший с HTML5 Указывает, что страница является частью иерархической структуры и что гиперссылка ведет к ресурсу верхнего уровня этой структуры.

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

, <область> , <ссылка> <форма>
последние Указывает, что гиперссылка ведет к последнему ресурсу последовательности , в которой находится текущая страница.

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

Несмотря на то, что синоним и конец признан неверно, его следует избегать.

, <область> , <ссылка> <форма>
лицензия Указывает, что гиперссылка ведет к документу, описывающему информацию о лицензировании.Если не внутри элемента , стандарт не различает гиперссылку, применяемую к определенной части документа или к документу в целом. Только данные на странице могут указывать на это.

Примечание: Несмотря на то, что синоним , авторское право , признан неверно, его следует избегать.

, <область> , <форма> , <ссылка> Нет.
манифест Указывает, что связанный файл является манифестом веб-приложения. <ссылка> , <область> , <форма>
модуль предварительной загрузки Инициирует раннюю (и высокоприоритетную) загрузку скриптов модуля. <ссылка> , <область> , <форма>
следующий Указывает, что гиперссылка ведет к следующему ресурсу последовательности , в которой находится текущая страница.

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

, <область> , <форма> , <ссылка> Нет.
nofollow Указывает, что связанный документ не одобрен автором этого документа, например, если он не контролирует его, если это плохой пример или если между ними существуют коммерческие отношения (проданная ссылка).Этот тип ссылки может использоваться некоторыми поисковыми системами, которые используют методы ранжирования популярности. , <область> , <форма> <ссылка>
noopener

Указывает браузеру открыть ссылку без предоставления нового контекста просмотра доступа к документу, который ее открыл - не устанавливая свойство Window.opener в открывшемся окне (возвращает , ноль, ).

Это особенно полезно при открытии ненадежных ссылок, чтобы гарантировать, что они не могут вмешиваться в исходный документ через свойство Window.opener (см. About rel = noopener для получения дополнительной информации), при этом все еще предоставляя заголовок HTTP Referer (если только не используется noreferrer ).

Обратите внимание, что при использовании noopener непустые имена целей, отличные от _top , _self и _parent , обрабатываются как _blank с точки зрения принятия решения об открытии нового окна / вкладки.

, <область> , <форма> <ссылка>
noreferrer

Запрещает браузеру при переходе на другую страницу отправлять адрес этой страницы или любое другое значение в качестве реферера через Referer: заголовок HTTP.
(В Firefox, до Firefox 37, это работало только в ссылках, найденных на страницах. Ссылки, нажимаемые в пользовательском интерфейсе, такие как «Открыть в новой вкладке» через контекстное меню, игнорировали это).

, <область> , <форма> <ссылка>
открывалка

Возвращает неявное rel = "noopener" добавление к ссылкам с target = "_ blank" (см. Обсуждение связанных HTML-спецификаций, изменение WebKit и обсуждение ошибок Firefox).

, <область> , <форма> <ссылка>
пингбэк Определяет URI внешнего ресурса для вызова, если кто-то хочет сделать комментарий или цитату о веб-странице.Протокол, используемый для такого вызова, определен в спецификации Pingback 1.0.

Примечание: , если также присутствует HTTP-заголовок X-Pingback: , он заменяет элемент этим типом ссылки.

<ссылка> , <область> , <форма>
предварительное соединение Предоставляет подсказку браузеру, в котором предлагается заранее открыть соединение со связанным веб-сайтом, не раскрывая какую-либо личную информацию и не загружая какой-либо контент, чтобы при переходе по ссылке связанный контент можно было получить быстрее. <ссылка> , <область> , <форма>
предварительная выборка Предполагает, что браузер заберет связанный ресурс заранее, так как он может быть запрошен пользователем. Начиная с Firefox 44, значение атрибута crossorigin учитывается, что позволяет делать анонимные предварительные выборки.

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

<ссылка> , <область> , <форма>
преднагрузка Сообщает браузеру загрузить ресурс, потому что этот ресурс понадобится позже во время текущей навигации. См. Предварительная загрузка содержимого с rel = "preload" для получения более подробной информации. <ссылка> , <область> , <форма>
prerender Предполагает, что браузер заберет связанный ресурс заранее, и что он также отображает предварительно выбранный контент за пределами экрана, чтобы он мог быть быстро представлен пользователю, когда это необходимо. <ссылка> , <область> , <форма>
пред Указывает, что гиперссылка ведет к ресурсу , предшествующему последовательности , в которой находится текущая страница.

Примечание: Также можно использовать ключевое слово next , чтобы указать ссылку на следующую страницу в последовательности.

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

, <область> , <ссылка> , <форма> Нет.
поиск Указывает, что гиперссылка ссылается на документ, интерфейс которого специально разработан для поиска в этом документе или на сайте и его ресурсах.

Если для атрибута типа установлено значение application / opensearchdescription + xml , то ресурс представляет собой плагин OpenSearch, который можно легко добавить в интерфейс некоторых браузеров, таких как Firefox или Internet Explorer.

, <область> , <ссылка> , <форма> Нет.
короткая ссылка shortlink Спецификация
Из Википедии, свободной энциклопедии: сокращение URL
Некоторые веб-сайты создают короткие ссылки, чтобы упростить обмен ссылками с помощью мгновенных сообщений.
<ссылка> ???
Боковая панель Устаревшая версия с Gecko 63 Указывает, что гиперссылка ведет к ресурсу, который лучше подходит для вторичного контекста просмотра, например, боковой панели .Браузеры, у которых нет такого контекста, будут игнорировать это ключевое слово.

Хотя раньше он был частью спецификации HTML, он был удален из спецификации и реализован только в версиях Firefox до Firefox 63.

, <область> , <ссылка> <форма>
, таблица стилей Определяет внешний ресурс, который будет использоваться в качестве таблицы стилей.Если тип не установлен, браузер должен предположить, что это таблица стилей text / css до дальнейшей проверки.

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

<ссылка> , <область> , <форма>
тег Указывает, что гиперссылка ссылается на документ, описывающий тег , который применяется к этому документу.

Примечание: Этот тип ссылок не следует устанавливать для ссылок на член облака тегов, поскольку они применяются не к одному документу, а к набору страниц.

, <область> <ссылка> , <форма>
до Указывает, что страница является частью иерархической структуры и что гиперссылка ведет к ресурсу более высокого уровня этой структуры.

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

, <область> , <ссылка> <форма>

ссылок в документах HTML

Ссылки в документах HTML

HTML предлагает множество традиционных идиом публикации для форматированного текста и структурированные документы, но что отличает его от большинства других языков разметки его функции для гипертекста и интерактивных документов. Этот раздел представляет ссылка (или гиперссылка, или веб-ссылка), базовая гипертекстовая конструкция. ссылка - это соединение одного веб-ресурса с другим. Хотя простой концепция, связь была одной из основных движущих сил успеха Web.

А ссылка имеет два конца - якоря - и направление. Ссылка начинается с «источника» и указывает на якорь назначения, которым может быть любой веб-ресурс (например, изображение, видео) клип, звуковой фрагмент, программа, документ HTML, элемент в HTML документ и т. д.).

12.1.1 Посещение связанного ресурса

Поведение по умолчанию, связанное со ссылкой, это получение другой веб-ресурс. Такое поведение обычно и неявно Получается путем выбора ссылки (e.г., нажав, через ввод с клавиатуры, и т.д.).

Следующий фрагмент HTML содержит две ссылки, одна якорь назначения - это HTML-документ с именем "chapter2.html" и Другой, якорь назначения которого представляет собой изображение GIF в файле "forest.gif":


  ... немного текста ... 

Вы найдете гораздо больше во второй главе . См. Также эту карту заколдованного леса.

Активируя эти ссылки (щелкая мышью, через клавиатуру ввод, голосовые команды и т. д.), пользователи могут посещать эти ресурсы. Обратите внимание, что HREF атрибут в каждом исходном якоре указывает адрес якоря назначения с URI.

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

Якоря назначения в документах HTML могут быть указаны либо A элемент (называя его name (атрибут ), или любым другим элементом (именование с атрибутом ID ).

Таким образом, например, автор может создать оглавление, записи которого ссылка на элементы заголовка х3 , х4 и т. д., в том же документе. Используя элемент A для создать якоря назначения, мы бы написали:

Содержание

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

Введение ... раздел 1 ...

Некоторые сведения ... раздел 2 ...

В личной заметке ... раздел 2.1 ...

Мы можем добиться того же эффекта, сделав сами элементы заголовка якоря:

Содержание

Введение
Некоторые сведения
Более личная заметка
... остальное оглавление ... ... тело документа ...

Введение ... раздел 1 ...

Некоторый фон ... раздел 2 ...

На более личной заметке ... раздел 2.1 ...

12.1.2 Другая ссылка отношения

Наиболее распространенное использование ссылки на - это получение другой сети. ресурс, как показано в предыдущих примерах.Тем не менее, авторы могут вставить ссылки в своих документах, которые выражают другие отношения между ресурсами чем просто «активировать эту ссылку, чтобы посетить этот связанный ресурс». Ссылки, которые У выражений других типов отношений есть один или несколько типов ссылок, указанных в их исходной привязке.

Роли ссылки, определяемой A или LINK , определяются через отн. и Rev атрибутов.

Например, ссылки, определенные элементом LINK , могут описывать положение документа в серии документов.В следующем отрывке ссылки в документе под названием «Глава 5» указать предыдущий и следующий главы:


  ... другая информация о головке ... 
 Глава 5 </ TITLE>
<LINK rel = "prev" href = "chapter4.html">
<LINK rel = "next" href = "chapter6.html">
</ HEAD>
 </pre>

 <p> Тип ссылки для первой ссылки - «предыдущая», а для второй - «следующая»
(два из нескольких распознанных типов ссылок).
Ссылки, указанные <samp> LINK </samp> - это <strong>, а не </strong>, отображаемые вместе с документом.
содержимое, хотя пользовательские агенты могут отображать их другими способами (например,г., как
инструменты навигации). </p>

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


 <h4> 12.1.3 Определение якорей и звеньев </h4>

 <p> Хотя некоторые элементы и атрибуты HTML создают ссылки на другие
ресурсы (например,г., элемент IMG </samp> <samp>, элемент <samp>
Элемент FORM </samp> и т. Д.), В этой главе рассматриваются ссылки и якоря
созданный из элементов <samp> LINK </samp> и <samp> A </samp>. Элемент <samp> LINK </samp> может появляться только в
глава документа. Элемент <samp> A </samp> может появляться только в теле. </p>

 <p> Когда <samp>
Атрибут </samp> элемента <samp> href </samp> установлен, элемент определяет источник
якорь для ссылки, которая может быть активирована пользователем для получения веб-ресурса.Исходная привязка - это местоположение экземпляра <samp> A </samp> и привязки назначения.
это веб-ресурс. </p>

 <p> Извлеченный ресурс может быть обработан пользовательским агентом несколькими способами:
открытие нового документа HTML в том же окне агента пользователя, открытие нового HTML
документ в другом окне, запуск новой программы для обработки ресурса,
и т. д. с <samp>
Элемент </samp> имеет контент (текст, изображения и т. Д.), Пользовательские агенты могут отображать
это содержание таким образом, чтобы указывать на наличие ссылки (e.г., по
подчеркивая содержание). </p>

 <p> Если заданы атрибуты <samp> name </samp> или <samp> id </samp> элемента <samp> A </samp>, элемент
определяет якорь, который может быть пунктом назначения других ссылок. </p>

 <p> Авторы могут установить атрибуты <samp> name </samp> и <samp> href </samp> одновременно в
тот же <samp>
Экземпляр </samp> </p>

 <p> <samp>
Элемент LINK </samp> определяет отношение между текущим документом и
другой ресурс. Хотя <samp> LINK </samp> не имеет контента, отношения, которые он определяет, могут
рендериться некоторыми пользовательскими агентами.</p>

 <h4> 12.1.4 Названия ссылок </h4>

 <p> <samp>
атрибут title </samp> может быть установлен как для <samp> A </samp>, так и для <samp> LINK </samp> для
добавить информацию о характере ссылки. Эта информация может быть передана
пользовательский агент, отображаемый в виде всплывающей подсказки, вызывает изменение изображения курсора и т. д. </p>


 <p> Таким образом, мы можем дополнить предыдущий пример
предоставив название для каждой ссылки: </p>

 <pre>
<BODY>
 <em> ... немного текста ... </em>
<P> Вы найдете намного больше в <A href = "главе2.HTML»
       title = "Перейти ко второй главе"> вторая глава </A>.
<A href = "./ chapter2.html"
       title = "Получить вторую главу."> Вторая глава </A>.
Смотрите также это <A href = "../ images / forest.gif"
       title = "GIF-изображение заколдованного леса"> карта
заколдованный лес. </A>
</ BODY>
 </pre>


 <h4> 12.1.5
Интернационализация и ссылки </h4>

 <p> Поскольку ссылки могут указывать на документы, закодированные с использованием различных кодировок символов, <samp> A </samp> и <samp> LINK </samp>
элементы поддерживают атрибут <samp> charset </samp>.Этот атрибут позволяет авторам
консультировать пользовательских агентов по поводу кодировки данных на другом конце ссылки. </p>

 <p> Атрибут <samp> hreflang </samp> предоставляет агентам пользователя
информация о языке ресурса в конце ссылки, так же как
 <samp>
Атрибут lang </samp> предоставляет информацию о языке
содержимое элемента или значения атрибута. </p>

 <p> Вооруженные этими дополнительными знаниями, пользовательские агенты должны быть в состоянии избежать
представление "мусора" пользователю.Вместо этого они могут либо найти ресурсы
необходимо для правильного представления документа или, если они не могут
найти ресурсы, они должны по крайней мере предупредить пользователя, что документ будет
быть нечитаемым и объяснить причину. </p>

 <h3><span class="ez-toc-section" id="_1_2_21_1_2_21_1212_-_A_LINK_Rev_LINK_5_5_-_-_LINK_-_HTML_1213_HTML_IMG_FORM_LINK_A_LINK_A_href_-_-_A_-_HTML_HTML_e_name_id_A_name_href_LINK_LINK_1214_title_A_LINK"> 12,2 <samp>
A </samp> элемент </span></h3>



 <p> <em> Начальный тег: <strong> требуется </strong>, Конечный тег: <strong>
требуется </strong> </em> </p>


 <p> <em> Определения атрибутов </em> </p>

 <dl>
 <dt> <samp> name </samp> = <em> cdata </em> [CS] </dt>

 <dd> Этот атрибут называет текущий якорь, чтобы он мог быть пунктом назначения
другой ссылки.Значением этого атрибута должно быть уникальное имя привязки.
область действия этого имени - текущий документ. Обратите внимание, что этот атрибут разделяет
то же пространство имен, что и у атрибута <samp> с идентификатором </samp> </dd>

 <dt> <samp> href </samp> = <em> uri </em> [CT] </dt>

 <dd> Этот атрибут указывает местоположение веб-ресурса, таким образом определяя
связь между текущим элементом (исходным якорем) и целевым якорем
определяется этим атрибутом. </dd>

 <dt> <samp> hreflang </samp> = <em> langcode </em> [CI] </dt>

 <dd> Этот атрибут указывает базовый язык ресурса, обозначенный <samp> href </samp>
и может использоваться, только если указано <samp> href </samp>.</dd>

 <dt> <samp> тип </samp> = <em> тип контента </em> [CI] </dt>

 <dd> Этот атрибут дает консультативную подсказку относительно типа контента контента
доступны по адресу целевой ссылки. Это позволяет агентам пользователя использовать
резервный механизм, а не извлекать контент, если им сообщают, что они
получит контент в типе контента, который они не поддерживают. </dd>

 <dd> Авторы, использующие этот атрибут, несут ответственность за управление риском
это может стать несовместимым с контентом, доступным в целевой ссылке
адрес.</dd>

 <dd> Текущий список зарегистрированных типов контента см. В
[MIMETYPES]. </dd>

 <dt> <samp> отн. </samp> = <em> типов каналов </em> [CI] </dt>

 <dd> Этот атрибут описывает отношение из текущего документа к
якорь, заданный атрибутом <samp> href </samp>. Значение этого атрибута
Разделенный пробелами список типов ссылок. </dd>

 <dt> <samp> rev </samp> = <em> типов каналов </em> [CI] </dt>

 <dd> Этот атрибут используется для описания обратной ссылки
от якоря, указанного
 <samp> href </samp> атрибут для текущего документа.
значение этого атрибута представляет собой разделенный пробелами список типов ссылок. </dd>

 <dt> <samp> charset </samp> = <em> charset </em> [CI] </dt>

 <dd> Этот атрибут определяет кодировку символов назначенного ресурса
по ссылке. Пожалуйста, обратитесь к разделу о характере
кодировки для более подробной информации. </dd>
 </dl>



 <p> <em> Атрибуты, определенные в другом месте </em> </p>

 <ul>
 <li> <samp>
id </samp>, <samp> class </samp> (идентификаторы всего документа) </li>

 <li> <samp>
lang </samp> (язык
информация), <samp> dir </samp> (текст
направление) </li>

 <li> <samp>
заголовок </samp> (заголовок элемента) </li>

 <li> <samp> стиль </samp> (встроенный
информация о стиле) </li>

 <li> <samp>
форма </samp> и <samp> координаты </samp> (изображение
карты) </li>

 <li> <samp> onfocus </samp>, <samp> onblur </samp>, <samp>
onclick </samp>, <samp> ondblclick </samp>, <samp>
onmousedown </samp>, <samp> onmouseup </samp>, <samp>
onmouseover </samp>, <samp> onmousemove </samp>, <samp>
onmouseout </samp>, <samp> onkeypress </samp>, <samp>
onkeydown </samp>, <samp> onkeyup </samp> (внутренние события) </li>

 <li> <samp>, цель </samp> (цель
кадр информации) </li>

 <li> <samp> tabindex </samp> (вкладка навигации) </li>

 <li> <samp> accesskey </samp> (ключи доступа) </li>
 </ul>


 <p> каждый <samp>
Элемент </samp> определяет якорь </p>

 <ol>
 <li> <samp>
Содержимое элемента </samp> определяет положение якоря.</li>

 <li> <samp>
Атрибут name </samp> называет якорь так, чтобы он мог быть пунктом назначения
ноль или более ссылок (см. также якоря с <samp>
id </samp>). </li>

 <li> <samp>
Атрибут href </samp> делает эту привязку исходной привязкой ровно одного
ссылка на сайт. </li>
 </ol>

 <p> Авторы могут также создать элемент <samp> A </samp>, который не указывает якорей, то есть
не указывает <samp> HREF </samp>,
 <samp> имя </samp> или <samp> идентификатор </samp>. Значения для этих атрибутов могут быть
установить позже через скрипты.</p>


 <p> В следующем примере
 <samp> Элемент </samp> определяет ссылку. Якорь источника
текст "W3C Web site" и якорь назначения - "http://www.w3.org/": </p>

 <pre>
Для получения дополнительной информации о W3C, пожалуйста, обратитесь к
<A href="http://www.w3.org/"> веб-сайт W3C </A>.
 </pre>

 <p> Эта ссылка обозначает домашнюю страницу Консорциума World Wide Web. Когда
Пользователь активирует эту ссылку в пользовательском агенте, пользовательский агент получит
ресурс, в данном случае HTML-документ.</p>

 <p>
Пользовательские агенты обычно отображают ссылки таким образом, чтобы сделать их
очевидно для пользователей (подчеркивание, обратное видео и т. д.). Точный рендеринг
зависит от агента пользователя. Рендеринг может варьироваться в зависимости от того, имеет ли пользователь
уже посетил ссылку или нет. Возможен визуальный рендеринг предыдущего
ссылка может быть: </p>

 <pre>
Для получения дополнительной информации о W3C, пожалуйста, посетите веб-сайт W3C.
                                                   ~~~~~~~~~~~~
 </pre>

 <p> Чтобы сообщить пользовательским агентам, что такое кодировка символов
целевая страница, установите
 <samp> кодировка </samp> атрибут: </p>

 <pre>
Для получения дополнительной информации о W3C, пожалуйста, обратитесь к
<A href = "http: // www.w3.org/ "charset =" ISO-8859-1 "> Веб-сайт W3C </A>
 </pre>



 <p> Предположим, мы определили якорь с именем «anchor-one» в файле «one.html». </p>

 <pre>
 <em> ... текст перед якорем ... </em>
<A name="anchor-one"> Это место привязки. </A>
 <em> ... текст после якоря ... </em>
 </pre>

 <p> Это создает якорь вокруг текста "Это место якоря
один. ". Обычно содержимое
 <samp> A </samp> не отображаются каким-либо особым образом, когда <samp> A </samp>
определяет только якорь.</p>

 <p> Определив якорь, мы можем связать его с тем же или другим
документ. URI, обозначающие якоря, содержат символ «#», за которым следует
имя якоря (фрагмент
идентификатор). Вот несколько примеров таких URI: </p>

 <ul>
 <li> Абсолютный URI: http://www.mycompany.com/one.html#anchor-one </li>

 <li> Относительный URI: ./one.html#anchor-one или
one.html # anchor-one </li>

 <li> Когда ссылка определена в том же документе: # anchor-one </li>
 </ul>

 <p> Таким образом, ссылка определена в файле «два.html "в том же каталоге, что и
«one.html» будет ссылаться на якорь следующим образом: </p>

 <pre>
 <em> ... текст перед ссылкой ... </em>
Для получения дополнительной информации, пожалуйста, обратитесь к <A href="./one.html#anchor-one"> anchor one </A>.
 <em> ... текст после ссылки ... </em>
 </pre>



 <p> <samp>
Элемент </samp> в следующем примере указывает ссылку (с <samp> href </samp>)
и создает именованный якорь (с именем <samp> </samp>) одновременно: </p>

 <pre>
Я только что вернулся из отпуска! Вот
<A name = "якорь-два"
   HREF = "HTTP: // WWW.somecompany.com/People/Ian/vacation/family.png ">
фотография моей семьи на озере. </A>.
 </pre>

 <p> Этот пример содержит ссылку на веб-ресурс другого типа (PNG
образ). Активация ссылки должна привести к извлечению ресурса изображения
из Интернета (и, возможно, отображается, если система была настроена на
так). </p>



 <p> <em> <strong> Примечание. </strong> Агенты пользователей должны быть в состоянии найти якоря
создан пустыми <samp> A </samp> элементами, но некоторые не в состоянии это сделать. Например, какой-то пользователь
агенты могут не найти «пустую привязку» в следующем фрагменте HTML: </em> </p>

 <pre>
<A name="empty-anchor"> </A>
<EM>.... немного HTML ... </ EM>
<A href="#empty-anchor"> Ссылка на пустой якорь </A>
 </pre>


 <h4><span class="ez-toc-section" id="1221"> 12.2.1 Синтаксис якоря
имена </span></h4>

 <p> Имя привязки - это значение имени <samp>, </samp> или идентификатора <samp>, </samp>.
атрибут при использовании в контексте якорей. Имена якорей должны соблюдать
следующие правила: </p>

 <ul>
 <li> <strong> Уникальность: </strong> Имена якорей должны быть
уникальный в документе. Имена якорей, которые отличаются только в том случае, если могут не отображаться
в том же документе. </li>

 <li>
 <strong> Строка соответствия: </strong> Сравнений
между идентификаторами фрагментов и
имена якорей должны быть сделаны точным (с учетом регистра) совпадением.</li>
 </ul>


 <p> Таким образом, следующий пример является верным в отношении соответствия строк и
должны рассматриваться как совпадения пользовательскими агентами: </p>

 <pre>
<P> <A href="#xxx"> ... </A>
 <em> ... больше документа ... </em>
<P> <A name="xxx"> ... </A>
 </pre>



 <p> НЕЗАКОННЫЙ ПРИМЕР:
 <br/> Следующий пример недопустим в отношении уникальности, так как два имени
одинаковы за исключением случая: </p>

 <pre>
<P> <A name="xxx"> ... </A>
<P> <A name="XXX">... </A>
 </pre>



 <p> Хотя следующий отрывок является допустимым HTML, поведение пользовательского агента
не определен; некоторые пользовательские агенты могут (неправильно) считать это совпадением и
другие не могут. </p>

 <pre>
<P> <A href="#xxx"> ... </A>
 <em> ... больше документа ... </em>
<P> <A name="XXX"> ... </A>
 </pre>


 <p> Имена якорей должны быть ограничены ASCII
персонажи. Пожалуйста, обратитесь к приложению для получения дополнительной информации о
не-ASCII символы в URI
значения атрибута.</p>

 <h4><span class="ez-toc-section" id="1222"> 12.2.2 Вложенные ссылки являются незаконными </span></h4>

 <p> Ссылки и якоря, определенные
 <samp> Элемент </samp> не должен быть вложенным; элемент <samp> A </samp>
не должно содержать никаких других <samp> A </samp> элементов. </p>

 <p> Поскольку DTD определяет
 <samp> LINK </samp> элемент должен быть пустым, <samp> LINK </samp>
элементы также не могут быть вложенными. </p>

 <h4><span class="ez-toc-section" id="1223_ID"> 12.2.3 Якоря с
 <samp> ID </samp> Атрибут </span></h4>

 <p> <samp>
Атрибут id </samp> может использоваться для создания привязки в начале тега любого
элемент (включая элемент <samp> A </samp>).</p>


 <p> Этот пример иллюстрирует использование атрибута <samp> id </samp> для позиционирования якоря в
<samp>
х3 </samp> элемент. Якорь связан с через <samp> A </samp>
элемент. </p>

 <pre>
Подробнее об этом вы можете прочитать в <A href="#section2"> втором разделе </A>.
 <em> ... позже в документе </em>
<h3><span class="ez-toc-section" id="_A_APPLET_FORM_IFRAME_IMG_MAP_HTML_-_DTD_HTML_D_xfc_rst_name_D_uuml_rst_ID_ID_ID_id_name_1224_-_123_LINK"> Раздел второй </ h3>
 <em> ... позже в документе </em>
<P> См. <A href="#section2"> второй раздел </A> выше.
Больше подробностей.
 </pre>



 <p> В следующем примере указывается якорь назначения с идентификатором <samp> </samp>
атрибут: </p>

 <pre>
Я только что вернулся из отпуска! Вот
<A> фотография моей семьи на озере.</A>.
 </pre>


 <p> <samp>
идентификаторы </samp> и <samp> имя </samp> атрибуты имеют одинаковые
пространство имен. Это означает, что они не могут оба
определить якорь с тем же именем в том же документе. Допустимо
используйте оба атрибута, чтобы указать уникальный идентификатор элемента для следующего
элементы: <samp>
A </samp>, <samp> APPLET </samp>, <samp> FORM </samp>, <samp>
РАМА </samp>,
 <samp> IFRAME </samp>, <samp> IMG </samp> и <samp> MAP </samp>. когда
оба атрибута используются в одном элементе, их значения должны быть
идентичны.</p>


 <p> НЕЗАКОННЫЙ ПРИМЕР:
 <br/> Следующий отрывок является недопустимым HTML, так как эти атрибуты объявляют
имя дважды в одном документе. </p>

 <pre>
<A href="#a1"> ... </A>
...
<H2>
 <em> ... страниц и страниц ... </em>
<A name="a1"> </A>
 </pre>



 <p> Следующий пример иллюстрирует, что <samp> с идентификатором </samp> и <samp> с именем </samp>
должен быть одинаковым, когда оба появляются в начальном теге элемента: </p>

 <pre>
<P> <A name="a1" href="#a1"> ... </A>
 </pre>


 <p> Из-за своей спецификации в DTD HTML, имя <samp> </samp>
атрибут может содержать
ссылки на символы.Таким образом, значение D & # xfc; rst является
действительный <samp>
Значение атрибута name </samp>, как и D & uuml; rst. <samp> ID </samp>
атрибут, с другой стороны, не может содержать символьные ссылки. </p>


 <p> <em> <strong> Использовать <samp> ID </samp> или <samp> имя </samp>? </strong> Авторы должны учитывать следующее
проблемы при принятии решения, использовать ли <samp> ID </samp> или <samp>
имя </samp> для имени якоря: </em> </p>

 <ul>
 <li> <em> <samp>
Атрибут id </samp> может выступать не только как имя привязки (например,г., стиль
селектор листа, идентификатор обработки и т. д.). </em> </li>

 <li> <em> Некоторые старые пользовательские агенты не поддерживают якоря, созданные с идентификатором <samp> </samp>
атрибут. </em> </li>

 <li> <em> Атрибут <samp> name </samp> позволяет использовать более богатые имена привязок (с объектами). </em> </li>
 </ul>


 <h4> 12.2.4 Недоступно и
неидентифицируемые ресурсы </h4>

 <p> Ссылка на недоступный или неидентифицируемый ресурс является ошибкой.
Хотя пользовательские агенты могут по-разному реагировать на такую ​​ошибку, мы рекомендуем
следующее поведение: </p>

 <ul>
 <li> Если пользовательский агент не может найти связанный ресурс, он должен предупредить
пользователь.</li>

 <li> Если пользовательский агент не может определить тип связанного ресурса, он должен
все еще пытаюсь обработать это. Это должно предупредить пользователя и может позволить пользователю
вмешаться и определить тип документа. </li>
 </ul>

 <h3><span class="ez-toc-section" id="_A_APPLET_FORM_IFRAME_IMG_MAP_HTML_-_DTD_HTML_D_xfc_rst_name_D_uuml_rst_ID_ID_ID_id_name_1224_-_123_LINK"> 12.3 Документные отношения:
 <samp> LINK </samp> элемент </span></h3>



 <p> <em> Начальный тег: <strong> требуется </strong>, Конечный тег: <strong>
запрещено </strong> </em> </p>


 <p> <em> Атрибуты, определенные в другом месте </em> </p>

 <ul>
 <li> <samp>
id </samp>, <samp> class </samp> (идентификаторы всего документа) </li>

 <li> <samp>
lang </samp> (язык
информация), <samp> dir </samp> (текст
направление) </li>

 <li> <samp>
заголовок </samp> (заголовок элемента) </li>

 <li> <samp> стиль </samp> (встроенный
информация о стиле) </li>

 <li> <samp> onclick </samp>, <samp> ondblclick </samp>, <samp>
onmousedown </samp>, <samp> onmouseup </samp>, <samp>
onmouseover </samp>, <samp> onmousemove </samp>, <samp>
onmouseout </samp>, <samp> onkeypress </samp>, <samp>
onkeydown </samp>, <samp> onkeyup </samp> (внутренние события) </li>

 <li> <samp>
href </samp>, <samp> hreflang </samp>,
 <samp> тип </samp>, <samp> отн. </samp>, <samp> рев </samp> (ссылки и
якоря) </li>

 <li> <samp>, цель </samp> (цель
кадр информации) </li>

 <li> <samp> медиа </samp> (заголовок
информация о стиле) </li>

 <li> <samp>
кодировка </samp> (символ
кодировки) </li>
 </ul>


 <p> Этот элемент определяет ссылку.В отличие от <samp> A </samp>, он может появиться только в <samp> HEAD </samp>
раздел документа, хотя он может появляться любое количество раз. Хотя <samp> ССЫЛКА </samp>
не имеет контента, он передает информацию об отношениях, которая может быть предоставлена
пользовательские агенты различными способами (например, панель инструментов с раскрывающимся меню
ссылки). </p>


 <p> Этот пример иллюстрирует, как несколько определений <samp> LINK </samp> могут появляться в <samp> HEAD </samp>
раздел документа. Текущий документ "Глава2.html ". <samp> отн. </samp>
Атрибут определяет связь связанного документа с текущим
документ. Значения «Index», «Next» и «Prev» описаны в разделе
на типах ссылок. </p>

 <pre>
<! DOCTYPE HTML PUBLIC "- // W3C // DTD HTML 4.01 // EN"
   "Http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<HEAD>
  <TITLE> Глава 2 </ TITLE>
  <LINK rel = "Index" href = "../ index.html">
  <LINK rel = "Next" href = "Chapter3.html">
  <LINK rel = "Prev" href = "Chapter1.HTML ">
</ HEAD>
 <em> ... остальная часть документа ... </em>
 </pre>


 <h4><span class="ez-toc-section" id="1231"> 12.3.1 Прямая и обратная связь </span></h4>

 <p> <samp>
атрибуты rel </samp> и <samp> rev </samp> играют дополнительные роли - <samp> rel </samp>
атрибут указывает прямую ссылку, а атрибут <samp> rev </samp> указывает обратную
ссылка на сайт. </p>

 <p> Рассмотрим два документа A и B. </p>

 <pre>
Документ A: <LINK href = "docB" rel = "foo">
 </pre>

 <p> Имеет то же значение, что и </p>

 <pre>
Документ B: <LINK href = "docA" rev = "foo">
 </pre>

 <p> Оба атрибута могут быть указаны одновременно.</p>

 <h4><span class="ez-toc-section" id="1232"> 12.3.2 Ссылки и внешние таблицы стилей </span></h4>

 <p> Когда <samp>
Элемент LINK </samp> связывает внешнюю таблицу стилей с документом <samp>
атрибут type </samp> определяет язык таблицы стилей, а <samp>
атрибут media </samp> указывает предполагаемый носитель визуализации или носитель.
Пользовательские агенты могут сэкономить время, извлекая из сети только те стили
листы, которые относятся к текущему устройству. </p>

 <p> Типы носителей информации
обсуждается в разделе о таблицах стилей.</p>

 <h4><span class="ez-toc-section" id="1233"> 12.3.3 Ссылки и поисковые системы </span></h4>

 <p> Авторы могут использовать элемент <samp> LINK </samp> для предоставления разнообразной информации
поисковые системы, в том числе: </p>

 <ul>
 <li> Ссылки на альтернативные версии документа, написанного другим человеком
язык. </li>

 <li> Ссылки на альтернативные версии документа, предназначенного для разных носителей,
например, версия, особенно подходящая для печати. </li>

 <li> Ссылки на стартовую страницу коллекции документов. </li>
 </ul>

 <p> Приведенные ниже примеры иллюстрируют, как языковая информация, типы носителей и
Типы ссылок могут быть объединены для улучшения обработки документов поисковыми системами.</p>


 <p> В следующем примере мы используем атрибут <samp> hreflang </samp>, чтобы указать поиск
движки, где можно найти версии документа на голландском, португальском и арабском языках.
Обратите внимание на использование атрибута <samp> charset </samp> для руководства на арабском языке. Обратите внимание также на
использование <samp>
атрибут lang </samp> для указания того, что значение заголовка <samp> равно </samp>
Атрибут для элемента <samp> LINK </samp>, обозначающий французское руководство, на французском языке. </p>

 <pre>
<HEAD>
<TITLE> Руководство на английском языке </ TITLE>
<LINK title = "Руководство на голландском языке"
      тип = "текст / html"
      отн = «альтернативный»
      hreflang = "п"
      HREF = "HTTP: // где-то.ком / ручной / dutch.html ">
<LINK title = "Руководство на португальском языке"
      тип = "текст / html"
      отн = «альтернативный»
      hreflang = "пт"
      HREF = "http://someplace.com/manual/portuguese.html">
<LINK title = "Руководство на арабском языке"
      тип = "текст / html"
      отн = «альтернативный»
      кодировка = "ISO-8859-6"
      hreflang = "ар"
      HREF = "http://someplace.com/manual/arabic.html">
<LINK lang = "fr" title = "Документация La Fran & Ccedil; ais"
      тип = "текст / html"
      отн = «альтернативный»
      hreflang = "пт"
      HREF = "HTTP: // где-то.ком / ручной / french.html ">
</ HEAD>
 </pre>



 <p> В следующем примере мы сообщаем поисковым системам, где найти напечатанную
версия руководства. </p>

 <pre>
<HEAD>
<TITLE> Справочное руководство </ TITLE>
<LINK media = "print" title = "Руководство в постскриптуме"
      тип = «приложения / постскриптум»
      отн = «альтернативный»
      HREF = "http://someplace.com/manual/postscript.ps">
</ HEAD>
 </pre>



 <p> В следующем примере мы сообщаем поисковым системам, где найти фронт
страница сборника документов.</p>

 <pre>
<HEAD>
<TITLE> Справочное руководство - Страница 5 </ TITLE>
<LINK rel = "Start" title = "Первая страница руководства"
      тип = "текст / html"
      HREF = "http://someplace.com/manual/start.html">
</ HEAD>
 </pre>


 <p> Дополнительная информация приведена в примечаниях к приложению о том, как помочь поисковым системам проиндексировать вашу сеть.
сайт. </p>

 <h3><span class="ez-toc-section" id="124"> 12.4 Информация о пути: элемент </span></h3> BASE <samp> </samp>


 <pre>
<! ELEMENT <samp> BASE </samp> - O EMPTY - URI базы документов ->
<! ATTLIST BASE
   <samp> HREF </samp>% URI; #REQUIRED - URI, который действует как базовый URI -
  >
 </pre>


 <p> <em> Начальный тег: <strong> требуется </strong>, Конечный тег: <strong>
запрещено </strong> </em> </p>


 <p> <em> Определения атрибутов </em> </p>

 <dl>
 <dt> <samp> href </samp> = <em> uri </em> [CT] </dt>

 <dd> Этот атрибут указывает абсолютный URI, который действует как базовый URI для
разрешение относительных URI.</dd>
 </dl>



 <p> <em> Атрибуты, определенные в другом месте </em> </p>




 <p> В HTML ссылки и ссылки на внешние изображения, апплеты, обработка форм
программы, таблицы стилей и т. д. всегда указываются с помощью URI. Относительные URI
разрешается в соответствии с базовым URI, который
может исходить из разных источников. Элемент <samp> BASE </samp> позволяет авторам явно указывать базовый URI документа. </p>

 <p> При наличии элемент <samp> BASE </samp> должен появляться в заголовке <samp> </samp>
раздел документа HTML, перед любым элементом, который ссылается на внешний
источник.Информация о пути, указанная элементом <samp> BASE </samp>, влияет только на URI в
документ, в котором появляется элемент. </p>


 <p> Например, с учетом следующей декларации <samp> BASE </samp> и <samp> A </samp>
декларация: </p>

 <pre>
<! DOCTYPE HTML PUBLIC "- // W3C // DTD HTML 4.01 // EN"
   "Http://www.w3.org/TR/html4/strict.dtd">
<HTML>
 <HEAD>
   <НАЗВАНИЕ> Наши продукты </ TITLE>
   <BASE href = "http://www.aviary.com/products/intro.html">
 </ HEAD>

 <BODY>
   <P> Вы видели нашего <A href = "../cages/birds.gif"> Клетки для птиц </A>?
 </ BODY>
</ HTML>
 </pre>

 <p> относительный URI "../cages/birds.gif" будет преобразован в: </p>

 <pre>
http://www.aviary.com/cages/birds.gif
 </pre>


 <h4><span class="ez-toc-section" id="1241_URI"> 12.4.1 Разрешение относительных URI </span></h4>

 <p> Агенты пользователей должны вычислять базовый URI для разрешения относительных URI
согласно [RFC1808], раздел 3. Далее описывается, как
[RFC1808] относится конкретно к HTML. </p>

 <p> Пользовательские агенты должны рассчитать базовый URI в соответствии со следующим
приоритеты (от наивысшего приоритета к наименьшему): </p>

 <ol>
 <li> Базовый URI устанавливается
 <samp> БАЗА </samp> элемент.</li>

 <li> Базовый URI задается метаданными, обнаруженными во время протокола
взаимодействие, такое как заголовок HTTP (см. [RFC2616]). </li>

 <li> По умолчанию базовый URI соответствует текущему документу. Не весь HTML
документы имеют базовый URI (например, допустимый HTML-документ может появиться в электронном письме
и не может быть обозначен URI). Такие HTML документы считаются
ошибочным, если они содержат относительные URI и полагаются на базовый URI по умолчанию. </li>
 </ol>

 <p> Кроме того, элементы <samp> OBJECT </samp> и <samp> APPLET </samp> определяют атрибуты, которые
имеет приоритет над значением, установленным элементом <samp> BASE </samp>.Пожалуйста, обратитесь к
определения этих элементов для получения дополнительной информации о проблемах URI, специфичных для
их. </p>


 <p> <em> <strong> Примечание. </strong> Для версий HTTP, которые определяют заголовок Link,
пользовательские агенты должны обрабатывать эти заголовки точно так же, как <samp> LINK </samp>
элементы в документе. HTTP 1.1, как определено в [RFC2616], не
включить поле заголовка ссылки (см. раздел 19.6.3). </em> </p>




                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    ,<div class='yarpp-related yarpp-related-none'>
<p>No related posts.</p>
</div>
											</div><!--/.entry-->
					
										
				</div><!--/.post-content-->
				<div class="post-sharrre group">
	<div id="twitter" data-url="https://ylianova.ru/html/link-rel-html-atribut-rel-htmlbook-ru.html" data-text="Link rel html: Атрибут rel | htmlbook.ru" data-title="Tweet"></div>
	<div id="facebook" data-url="https://ylianova.ru/html/link-rel-html-atribut-rel-htmlbook-ru.html" data-text="Link rel html: Атрибут rel | htmlbook.ru" data-title="Like"></div>
	<div id="googleplus" data-url="https://ylianova.ru/html/link-rel-html-atribut-rel-htmlbook-ru.html" data-text="Link rel html: Атрибут rel | htmlbook.ru" data-title="+1"></div>
	<div id="pinterest" data-url="https://ylianova.ru/html/link-rel-html-atribut-rel-htmlbook-ru.html" data-text="Link rel html: Атрибут rel | htmlbook.ru" data-title="Pin It"></div>
</div><!--/.post-sharrre-->

<script type="text/javascript">
	// Sharrre
	jQuery(document).ready(function(){
		jQuery('#twitter').sharrre({
			share: {
				twitter: true
			},
			template: '<a class="box group" href="#"><div class="count" href="#">{total}</div><div class="share"><i class="fa fa-twitter"></i></div></a>',
			enableHover: false,
			enableTracking: true,
			buttons: { twitter: {via: ''}},
			click: function(api, options){
				api.simulateClick();
				api.openPopup('twitter');
			}
		});
		jQuery('#facebook').sharrre({
			share: {
				facebook: true
			},
			template: '<a class="box group" href="#"><div class="count" href="#">{total}</div><div class="share"><i class="fa fa-facebook-square"></i></div></a>',
			enableHover: false,
			enableTracking: true,
			click: function(api, options){
				api.simulateClick();
				api.openPopup('facebook');
			}
		});
		jQuery('#googleplus').sharrre({
			share: {
				googlePlus: true
			},
			template: '<a class="box group" href="#"><div class="count" href="#">{total}</div><div class="share"><i class="fa fa-google-plus-square"></i></div></a>',
			enableHover: false,
			enableTracking: true,
			urlCurl: 'https://ylianova.ru/wp-content/themes/anew/js/sharrre.php',
			click: function(api, options){
				api.simulateClick();
				api.openPopup('googlePlus');
			}
		});
		jQuery('#pinterest').sharrre({
			share: {
				pinterest: true
			},
			template: '<a class="box group" href="#" rel="nofollow"><div class="count" href="#">{total}</div><div class="share"><i class="fa fa-pinterest"></i></div></a>',
			enableHover: false,
			enableTracking: true,
			buttons: {
			pinterest: {
				description: 'Link rel html: Атрибут rel | htmlbook.ru'				}
			},
			click: function(api, options){
				api.simulateClick();
				api.openPopup('pinterest');
			}
		});
	});
</script>				
			</div><!--/.post-inner-->
			
		</article><!--/.post-->			
			
		
		<ul class="post-nav group">
		<li class="next"><a href="https://ylianova.ru/raznoe-2/razmer-fotografij-dlya-pechati-razmery-fotografij-dlya-pechati-tablica-formatov-s-primerami.html" rel="next"><i class="fa fa-chevron-right"></i><strong>Вперед</strong> <span>Размер фотографий для печати: Размеры фотографий для печати таблица форматов с примерами</span></a></li>
		<li class="previous"><a href="https://ylianova.ru/raznoe-2/abstraktnye-klassy-php-php-abstraktnye-klassy-manual.html" rel="prev"><i class="fa fa-chevron-left"></i><strong>Назад</strong> <span>Абстрактные классы php: PHP: Абстрактные классы — Manual</span></a></li>
	</ul>
	
		
	    <div class="wpdiscuz_top_clearing"></div>
    <div id="comments" class="comments-area"><div id="respond" style="width: 0;height: 0;clear: both;margin: 0;padding: 0;"></div>            <h3 id="wc-comment-header">
                                Отправить ответ            </h3>
                    <div id="wpcomm" class="wpdiscuz_unauth wpd-default">
            <div class="wpdiscuz-form-top-bar">
                <div class="wpdiscuz-ftb-left">
                                                            <div id="wc_show_hide_loggedin_username">
                                            </div>
                </div>
                                <div class="wpd-clear"></div>
            </div>


                        <div class="wc_social_plugin_wrapper">
                            </div>
                    <div class="wc-form-wrapper wc-main-form-wrapper"  id='wc-main-form-wrapper-0_0' >
            <div class="wpdiscuz-comment-message" style="display: block;"></div>
                                        <form class="wc_comm_form wc_main_comm_form" method="post"  enctype="multipart/form-data">
                    <div class="wc-field-comment">
                        <div class="wpdiscuz-item wc-field-textarea" >
                            <div class="wpdiscuz-textarea-wrap ">

                                                                                                        <div class="wc-field-avatararea">
                                        <img alt='avatar' src='https://secure.gravatar.com/avatar/?s=40&d=mm&r=g' srcset='https://secure.gravatar.com/avatar/?s=80&d=mm&r=g 2x' class='avatar avatar-40 photo avatar-default' height='40' width='40' loading='lazy'/>                                    </div>
                                
                                <textarea id="wc-textarea-0_0"   placeholder="Начать обсуждение..." required name="wc_comment" class="wc_comment wpd-field"></textarea>
                                                                                            </div>
                        </div>
                        <div class="clearfix"></div>
                    </div>
                    <div class="wc-form-footer"  style="display: none;"> 
                                <div class="wpd-form-row">
                    <div class="wpd-form-col-left">
                        <div class="wpdiscuz-item wc_name-wrapper wpd-has-icon">
                                <div class="wpd-field-icon"><i class="fas fa-user"></i></div>
                                                <input value="" required="required" class="wc_name wpd-field" type="text" name="wc_name" placeholder="Имя*" maxlength="50" pattern=".{3,50}" title="">
                            </div>
                        <div class="wpdiscuz-item wc_email-wrapper wpd-has-icon">
                                    <div class="wpd-field-icon"><i class="fas fa-at"></i></div>
                                                <input value="" required="required" class="wc_email wpd-field" type="email" name="wc_email" placeholder="Email*">
                            </div>
                            <div class="wpdiscuz-item wc_website-wrapper wpd-has-icon">
                                            <div class="wpd-field-icon"><i class="fas fa-link"></i></div>
                                        <input value="" class="wc_website wpd-field" type="text" name="wc_website" placeholder="Website">
                                            </div>
                        </div>
                <div class="wpd-form-col-right">
                    <div class="wc-field-captcha wpdiscuz-item wc_captcha-wrapper">
            <div class="wc-captcha-input">
                <input type="text" maxlength="5" value="" autocomplete="off" required="required" name="wc_captcha"  class="wpd-field wc_field_captcha" placeholder="Code" title="Вставьте код CAPTCHA">
            </div>
            <div class="wc-label wc-captcha-label">
                                <a class="wpdiscuz-nofollow" href="#" rel="nofollow"><img alt="wpdiscuz_captcha" class="wc_captcha_img" src="https://ylianova.ru/wp-content/plugins/wpdiscuz/utils/captcha/captcha.php?key=c5f807fb6b55fb"  width="80" height="26"/></a><a class="wpdiscuz-nofollow wc_captcha_refresh_img" href="#" rel="nofollow"><img  alt="refresh" class="" src="https://ylianova.ru/wp-content/plugins/wpdiscuz/assets/img/captcha-loading.png" width="16" height="16"/></a>
                <input type="hidden" id="c5f807fb6b55fb" class="wpdiscuz-cnonce" name="cnonce" value="c5f807fb6b55fb" />
            </div>
            <div class="clearfix"></div>
        </div>
                <div class="wc-field-submit">
                                            
                                            <label class="wpd_label" title="Сообщать о всех новых ответах на мои комментарии">
                            <input id="wc_notification_new_comment-0_0" class="wc_notification_new_comment-0_0 wpd_label__checkbox" value="comment" type="checkbox" name="wpdiscuz_notification_type" />
                            <span class="wpd_label__text">
                                <span class="wpd_label__check">
                                    <i class="fas fa-bell wpdicon wpdicon-on"></i>
                                    <i class="fas fa-bell-slash wpdicon wpdicon-off"></i>
                                </span>
                            </span>
                        </label>
                                                                <input class="wc_comm_submit wc_not_clicked button alt" type="submit" name="submit" value="Оставить комментарий">
        </div>
                </div>
                    <div class="clearfix"></div>
        </div>
                            </div>
                    <div class="clearfix"></div>
                    <input type="hidden" class="wpdiscuz_unique_id" value="0_0" name="wpdiscuz_unique_id">
                </form>
                        </div>
                <div id = "wpdiscuz_hidden_secondary_form" style = "display: none;">
                    <div class="wc-form-wrapper wc-secondary-form-wrapper"  id='wc-secondary-form-wrapper-wpdiscuzuniqueid'  style='display: none;' >
            <div class="wpdiscuz-comment-message" style="display: block;"></div>
                            <div class="wc-secondary-forms-social-content"></div><div class="clearfix"></div>
                                        <form class="wc_comm_form wc-secondary-form-wrapper" method="post"  enctype="multipart/form-data">
                    <div class="wc-field-comment">
                        <div class="wpdiscuz-item wc-field-textarea" >
                            <div class="wpdiscuz-textarea-wrap ">

                                                                                                        <div class="wc-field-avatararea">
                                        <img alt='avatar' src='https://secure.gravatar.com/avatar/?s=48&d=mm&r=g' srcset='https://secure.gravatar.com/avatar/?s=96&d=mm&r=g 2x' class='avatar avatar-48 photo avatar-default' height='48' width='48' loading='lazy'/>                                    </div>
                                
                                <textarea id="wc-textarea-wpdiscuzuniqueid"   placeholder="Присоединиться к обсуждению..." required name="wc_comment" class="wc_comment wpd-field"></textarea>
                                                                                            </div>
                        </div>
                        <div class="clearfix"></div>
                    </div>
                    <div class="wc-form-footer"  style="display: none;"> 
                                <div class="wpd-form-row">
                    <div class="wpd-form-col-left">
                        <div class="wpdiscuz-item wc_name-wrapper wpd-has-icon">
                                <div class="wpd-field-icon"><i class="fas fa-user"></i></div>
                                                <input value="" required="required" class="wc_name wpd-field" type="text" name="wc_name" placeholder="Имя*" maxlength="50" pattern=".{3,50}" title="">
                            </div>
                        <div class="wpdiscuz-item wc_email-wrapper wpd-has-icon">
                                    <div class="wpd-field-icon"><i class="fas fa-at"></i></div>
                                                <input value="" required="required" class="wc_email wpd-field" type="email" name="wc_email" placeholder="Email*">
                            </div>
                            <div class="wpdiscuz-item wc_website-wrapper wpd-has-icon">
                                            <div class="wpd-field-icon"><i class="fas fa-link"></i></div>
                                        <input value="" class="wc_website wpd-field" type="text" name="wc_website" placeholder="Website">
                                            </div>
                        </div>
                <div class="wpd-form-col-right">
                    <div class="wc-field-captcha wpdiscuz-item wc_captcha-wrapper">
            <div class="wc-captcha-input">
                <input type="text" maxlength="5" value="" autocomplete="off" required="required" name="wc_captcha"  class="wpd-field wc_field_captcha" placeholder="Code" title="Вставьте код CAPTCHA">
            </div>
            <div class="wc-label wc-captcha-label">
                                <a class="wpdiscuz-nofollow" href="#" rel="nofollow"><img alt="wpdiscuz_captcha" class="wc_captcha_img" src="https://ylianova.ru/wp-content/plugins/wpdiscuz/utils/captcha/captcha.php?key=c5f807fb6b58ec"  width="80" height="26"/></a><a class="wpdiscuz-nofollow wc_captcha_refresh_img" href="#" rel="nofollow"><img  alt="refresh" class="" src="https://ylianova.ru/wp-content/plugins/wpdiscuz/assets/img/captcha-loading.png" width="16" height="16"/></a>
                <input type="hidden" id="c5f807fb6b58ec" class="wpdiscuz-cnonce" name="cnonce" value="c5f807fb6b58ec" />
            </div>
            <div class="clearfix"></div>
        </div>
                <div class="wc-field-submit">
                                            
                                            <label class="wpd_label" title="Сообщать о всех новых ответах на мои комментарии">
                            <input id="wc_notification_new_comment-wpdiscuzuniqueid" class="wc_notification_new_comment-wpdiscuzuniqueid wpd_label__checkbox" value="comment" type="checkbox" name="wpdiscuz_notification_type" />
                            <span class="wpd_label__text">
                                <span class="wpd_label__check">
                                    <i class="fas fa-bell wpdicon wpdicon-on"></i>
                                    <i class="fas fa-bell-slash wpdicon wpdicon-off"></i>
                                </span>
                            </span>
                        </label>
                                                                <input class="wc_comm_submit wc_not_clicked button alt" type="submit" name="submit" value="Оставить комментарий">
        </div>
                </div>
                    <div class="clearfix"></div>
        </div>
                            </div>
                    <div class="clearfix"></div>
                    <input type="hidden" class="wpdiscuz_unique_id" value="wpdiscuzuniqueid" name="wpdiscuz_unique_id">
                </form>
                        </div>
                </div>
                                           

                                    <div class="wpdiscuz-front-actions">
                                                    <div class="wpdiscuz-sbs-wrap">
                                <span><i class="far fa-envelope" aria-hidden="true"></i>  Подписаться  <i class="fas fa-caret-down" aria-hidden="true"></i></span>
                            </div>
                                                                        <div class="clearfix"></div>
                    </div>
                                                    <div class="wpdiscuz-subscribe-bar wpdiscuz-hidden">
                                                    <form action="https://ylianova.ru/wp-admin/admin-ajax.php?action=addSubscription" method="post" id="wpdiscuz-subscribe-form">
                                <div class="wpdiscuz-subscribe-form-intro">Уведомление о </div>
                                <div class="wpdiscuz-subscribe-form-option" style="width:40%;">
                                    <select class="wpdiscuz_select" name="wpdiscuzSubscriptionType" >
                                                                                    <option value="post">новые последующие комментарии</option>
                                                                                                                            <option value="all_comment" >новые ответы на мои комментарии</option>
                                                                            </select>
                                </div>
                                                                    <div class="wpdiscuz-item wpdiscuz-subscribe-form-email">
                                        <input  class="email" type="email" name="wpdiscuzSubscriptionEmail" required="required" value="" placeholder="Email"/>
                                    </div>
                                                                <div class="wpdiscuz-subscribe-form-button">
                                    <input id="wpdiscuz_subscription_button" type="submit" value="›" name="wpdiscuz_subscription_button" />
                                </div> 
                                                                <input type="hidden" id="wpdiscuz_subscribe_form_nonce" name="wpdiscuz_subscribe_form_nonce" value="1c06bf69d1" /><input type="hidden" name="_wp_http_referer" value="/html/link-rel-html-atribut-rel-htmlbook-ru.html" />                                                                <input type="hidden" value="5948" name="wpdiscuzSubscriptionPostId" />
                            </form>
                                                <div class="wpdiscuz_clear"></div>
                                            </div>
                    
                                <div id="wcThreadWrapper" class="wc-thread-wrapper">
                                    
                    <div class="wpdiscuz-comment-pagination">
                                            </div>
                </div>
                <div class="wpdiscuz_clear"></div>
                                            </div>
        </div>
        <div id="wpdiscuz-loading-bar" class="wpdiscuz-loading-bar wpdiscuz-loading-bar-unauth"></div>
        	
	</div><!--/.pad-->
	
</section><!--/.content-->


	<div class="sidebar s1">
		
		<a class="sidebar-toggle" title="Развернуть боковую панель"><i class="fa icon-sidebar-toggle"></i></a>
		
		<div class="sidebar-content">
				
						
			<div id="search-2" class="widget widget_search"><form method="get" class="searchform themeform" action="https://ylianova.ru/">
	<div>
		<input type="text" class="search" name="s" onblur="if(this.value=='')this.value='Введите поисковую фразу';" onfocus="if(this.value=='Введите поисковую фразу')this.value='';" value="Введите поисковую фразу" />
	</div>
</form></div><div id="nav_menu-2" class="widget widget_nav_menu"><h3>Рубрики</h3><div class="menu-2-container"><ul id="menu-2" class="menu"><li id="menu-item-5370" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-5370"><a href="https://ylianova.ru/category/css">Css</a></li>
<li id="menu-item-5371" class="menu-item menu-item-type-taxonomy menu-item-object-category current-post-ancestor current-menu-parent current-post-parent menu-item-5371"><a href="https://ylianova.ru/category/html">Html</a></li>
<li id="menu-item-5372" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-5372"><a href="https://ylianova.ru/category/http">Http</a></li>
<li id="menu-item-5373" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-5373"><a href="https://ylianova.ru/category/javascript">Javascript</a></li>
<li id="menu-item-5374" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-5374"><a href="https://ylianova.ru/category/photoshop">Photoshop</a></li>
<li id="menu-item-5375" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-5375"><a href="https://ylianova.ru/category/verstka">Верстка</a></li>
<li id="menu-item-5376" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-5376"><a href="https://ylianova.ru/category/raznoe">Вопросы и ответы</a></li>
<li id="menu-item-5377" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-5377"><a href="https://ylianova.ru/category/maket">Макет</a></li>
<li id="menu-item-5378" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-5378"><a href="https://ylianova.ru/category/sajt">Развитие сайтов</a></li>
<li id="menu-item-5380" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-5380"><a href="https://ylianova.ru/category/sajt-2">Сайт</a></li>
<li id="menu-item-5381" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-5381"><a href="https://ylianova.ru/category/shablon-2">Шаблон</a></li>
<li id="menu-item-5382" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-5382"><a href="https://ylianova.ru/category/shrift-2">Шрифт</a></li>
<li id="menu-item-5379" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-5379"><a href="https://ylianova.ru/category/raznoe-2">Разное</a></li>
</ul></div></div><div id="categories-3" class="widget widget_categories"><h3>Рубрики</h3>
			<ul>
					<li class="cat-item cat-item-5"><a href="https://ylianova.ru/category/css">Css</a>
</li>
	<li class="cat-item cat-item-4"><a href="https://ylianova.ru/category/html">Html</a>
</li>
	<li class="cat-item cat-item-9"><a href="https://ylianova.ru/category/http">Http</a>
</li>
	<li class="cat-item cat-item-10"><a href="https://ylianova.ru/category/javascript">Javascript</a>
</li>
	<li class="cat-item cat-item-11"><a href="https://ylianova.ru/category/photoshop">Photoshop</a>
</li>
	<li class="cat-item cat-item-17"><a href="https://ylianova.ru/category/verstka">Верстка</a>
</li>
	<li class="cat-item cat-item-3"><a href="https://ylianova.ru/category/raznoe">Вопросы и ответы</a>
</li>
	<li class="cat-item cat-item-16"><a href="https://ylianova.ru/category/maket">Макет</a>
</li>
	<li class="cat-item cat-item-6"><a href="https://ylianova.ru/category/sajt">Развитие сайтов</a>
</li>
	<li class="cat-item cat-item-13"><a href="https://ylianova.ru/category/raznoe-2">Разное</a>
</li>
	<li class="cat-item cat-item-12"><a href="https://ylianova.ru/category/sajt-2">Сайт</a>
</li>
	<li class="cat-item cat-item-15"><a href="https://ylianova.ru/category/shablon-2">Шаблон</a>
</li>
	<li class="cat-item cat-item-7"><a href="https://ylianova.ru/category/shablon">Шаблоны</a>
</li>
	<li class="cat-item cat-item-14"><a href="https://ylianova.ru/category/shrift-2">Шрифт</a>
</li>
	<li class="cat-item cat-item-8"><a href="https://ylianova.ru/category/shrift">Шрифты</a>
</li>
			</ul>

			</div><div id="custom_html-21" class="widget_text widget widget_custom_html"><div class="textwidget custom-html-widget"><style>iframe,object{width:100%;height:480px}img{max-width:100%}</style><script type="text/javascript">jQuery(document).ready(function($){$('.mylink').replaceWith(function(){return'<a href="'+$(this).attr('data-url')+'" title="'+$(this).attr('title')+'">'+$(this).html()+'</a>'})});new Image().src="//counter.yadro.ru/hit?r"+escape(document.referrer)+((typeof(screen)=="undefined")?"":";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth?screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+";h"+escape(document.title.substring(0,150))+";"+Math.random();</script></div></div>			
		</div><!--/.sidebar-content-->
		
	</div><!--/.sidebar-->
	

		</div><!--/.main-->
	</div><!--/.container-inner-->
	
	<footer id="footer">	
				
				
		<section id="footer-bottom">
			<div class="container">
			
				<a id="back-to-top" href="#"><i class="fa fa-angle-up"></i></a>
				
				<div class="pad group">				
					<div class="grid one-half">
					
												
						<div id="copyright">
															<p>Блог сумасшедшего сисадмина © 2020. Все права защищены.</p>
													</div><!--/#copyright-->
						
												<div id="credit">
							<p><a href="/sitemap.xml" class="c_sitemap">Карта сайта</a>
</p>
						</div><!--/#credit-->
												
					</div>		
					<div class="grid one-half last">	
											</div>		
				</div><!--/.pad-->
				
			</div><!--/.container-->
		</section><!--/#footer-bottom-->
		
	</footer><!--/#footer-->

</div><!--/#wrapper-->

		<style type="text/css">
			.archive #nav-above,
					.archive #nav-below,
					.search #nav-above,
					.search #nav-below,
					.blog #nav-below,
					.blog #nav-above,
					.navigation.paging-navigation,
					.navigation.pagination,
					.pagination.paging-pagination,
					.pagination.pagination,
					.pagination.loop-pagination,
					.bicubic-nav-link,
					#page-nav,
					.camp-paging,
					#reposter_nav-pages,
					.unity-post-pagination,
					.wordpost_content .nav_post_link,.page-link,
					.page-links,#comments .navigation,
					#comment-nav-above,
					#comment-nav-below,
					#nav-single,
					.navigation.comment-navigation,
					comment-pagination {
						display: none !important;
					}
					.single-gallery .pagination.gllrpr_pagination {
						display: block !important;
					}		</style>
	<a id='wpdUserContentInfoAnchor' style='display:none;' rel='#wpdUserContentInfo' data-wpd-lity>wpDiscuz</a><div id='wpdUserContentInfo' style='overflow:auto;background:#FDFDF6;padding:20px;width:600px;max-width:100%;border-radius:6px;' class='lity-hide'></div><link rel='stylesheet' id='yarppRelatedCss-css'  href='https://ylianova.ru/wp-content/plugins/yet-another-related-posts-plugin/style/related.css?ver=5.5.1' type='text/css' media='all' />
<link rel='stylesheet' id='pgntn_stylesheet-css'  href='https://ylianova.ru/wp-content/plugins/pagination/css/nav-style.css?ver=5.5.1' type='text/css' media='all' />
<script type='text/javascript' src='https://ylianova.ru/wp-includes/js/jquery/jquery.form.min.js?ver=4.2.1' id='jquery-form-js'></script>
<script type='text/javascript' src='https://ylianova.ru/wp-content/themes/anew/js/jquery.jplayer.min.js?ver=5.5.1' id='jplayer-js'></script>
<script type='text/javascript' src='https://ylianova.ru/wp-content/themes/anew/js/scripts.js?ver=5.5.1' id='scripts-js'></script>
<script type='text/javascript' src='https://ylianova.ru/wp-content/themes/anew/js/jquery.sharrre.min.js?ver=5.5.1' id='sharrre-js'></script>
<script type='text/javascript' src='https://ylianova.ru/wp-includes/js/comment-reply.min.js?ver=5.5.1' id='comment-reply-js'></script>
<script type='text/javascript' src='https://ylianova.ru/wp-includes/js/wp-embed.min.js?ver=5.5.1' id='wp-embed-js'></script>
<script type='text/javascript' src='https://ylianova.ru/wp-content/plugins/easy-table-of-contents/vendor/smooth-scroll/jquery.smooth-scroll.min.js?ver=1.5.5' id='jquery-smooth-scroll-js'></script>
<script type='text/javascript' src='https://ylianova.ru/wp-content/plugins/easy-table-of-contents/vendor/js-cookie/js.cookie.min.js?ver=2.0.3' id='js-cookie-js'></script>
<script type='text/javascript' src='https://ylianova.ru/wp-content/plugins/easy-table-of-contents/vendor/sticky-kit/jquery.sticky-kit.min.js?ver=1.9.2' id='jquery-sticky-kit-js'></script>
<script type='text/javascript' src='https://ylianova.ru/wp-content/plugins/easy-table-of-contents/vendor/waypoints/jquery.waypoints.min.js?ver=1.9.2' id='jquery-waypoints-js'></script>
<script type='text/javascript' id='ez-toc-js-js-extra'>
/* <![CDATA[ */
var ezTOC = {"smooth_scroll":"1","visibility_hide_by_default":"","width":"auto","scroll_offset":"30"};
/* ]]> */
</script>
<script type='text/javascript' src='https://ylianova.ru/wp-content/plugins/easy-table-of-contents/assets/js/front.min.js?ver=1.7' id='ez-toc-js-js'></script>
<!--[if lt IE 9]>
<script src="https://ylianova.ru/wp-content/themes/anew/js/ie/respond.js"></script>
<![endif]-->
</body>
</html>