Атрибут target | htmlbook.ru
Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
1.0+ | 1.0+ | 1.0+ | 1.0+ | 1.0+ | 1.0+ | 1.0+ |
Спецификация
HTML: | 3.2 | 4.01 | 5.0 | XHTML: | 1.0 | 1.1 |
Описание
Вы можете определить окно, в которое будет загружаться веб-страница, открытая по ссылке. Для этого используется атрибут target, в качестве его значения указывается имя окна или фрейма. Если target не установлен, возвращаемый результат показывается в текущем окне.
Синтаксис
<base target="имя окна">
Значения
В качестве значения используется имя окна или фрейма. Если установлено несуществующее
имя, то будет открыто новое окно. В качестве зарезервированных имен используются
следующие.
- _blank
- Загружает страницу в новое окно браузера.
- _self
- Загружает страницу в текущее окно.
- _parent
- Загружает страницу во фрейм-родитель, если фреймов нет, то это значение работает как _self.
- _top
- Отменяет все фреймы и загружает страницу в полном окне браузера, если фреймов нет, то это значение работает как _self.
Если для тега <base> установлен target=»_blank», можно сделать чтобы ссылка открывалась в текущем окне, если добавить к тегу <a> атрибут target=»_self».
Значение по умолчанию
_self
Валидация
Использование этого атрибута осуждается спецификацией HTML, валидный код получается только при использовании переходного <!DOCTYPE>.
Пример 1
HTML 4.01IECrOpSaFx
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.
dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Тег base, атрибут target</title> <base target="_blank"> </head> <body> <p><a href="new.html">Ссылка откроется в новом окне</a></p> <p><a href="current.html" target="_self">Ссылка откроется в текущем окне</a></p> </body> </html>
Пример 2
HTML5IECrOpSaFx
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>Тег base, атрибут target</title> <base target="_blank"> </head> <body> <p><a href="new.html">Ссылка откроется в новом окне</a></p> <p><a href="current.html" target="_self">Ссылка откроется в текущем окне</a></p> </body> </html>
Тег base
Пример
Укажите URL-адрес по умолчанию и целевой объект по умолчанию для всех ссылок на странице:
<body>
<img src=»stickman. gif» alt=»Stickman»>
<a href=»https://html5css.ru»>html5css</a>
</body>
Определение и использование
Тег <base> указывает базовый URL-адрес/целевой объект для всех относительных URL-адресов в документе.
Может быть максимум один <base> в документе, и он должен находиться внутри элемента <head> Элемент.
Поддержка браузера
Элемент | |||||
---|---|---|---|---|---|
<base> | Да | Да | Да | Да | Да |
Советы и примечания
Примечание: Если в <base> Тег присутствует, он должен иметь либо атрибут href или целевой атрибут, или оба.
Различия между HTML 4,01 и HTML5
Нет.
Различия между HTML и XHTML
В HTML <base> тег не имеет конечного тега.
В XHTML <base> Тег должен быть правильно закрыт.
Атрибуты
Атрибут | Значение | Описание |
---|---|---|
href | URL | Указывает базовый URL-адрес для всех относительных URL-адресов на странице |
target | _blank _parent _self _top framename |
Задает целевой объект по умолчанию для всех гиперссылок и форм на странице |
Глобальные атрибуты и события
Тег <base> также поддерживает Глобальные атрибуты в HTML.
Атрибуты события
Нету. Тег <base> не поддерживает атрибуты событий.
Похожие страницы
HTML DOM Ссылки: Base Object
Параметры CSS по умолчанию
Нет.
base — html тег для ссылок
HTML тег base инструктирует браузер относительно полного базового адреса текущего документа.<base>
определен внутри контейнера head и инструктирует браузер относительно полного базового адреса текущего документа.
<base>
предназначен для документов, в которых используется относительный адрес и эти документы могут переноситься в другую папку или даже на другой компьютер без потери связи. Браузер ищет тег <base>
, определяет полный адрес документа и корректно загружает его. Давате рассмотрим пример.
Пусть адрес документа указан как <base href="http://site.ru/assets/">
, то при добавлении рисунков достаточно использовать относительный адрес
. При этом полный путь к изображению будет http://site.ru/assets/images/logo.jpg
, что позволяет браузеру всегда находить графический файл, независимо от того, где находится текущая веб-страница. Также можно применять и иерархическую систему пути с двумя точками. Так, если изображение добавляется как <img src="../images/logo.jpg">
, то полный путь к файлу будет http://site.ru/images/logo.jpg
. Второе применение тега <base>
— задание целевого окна для всех ссылок на текущей странице.
Если на странице встречается несколько тегов
base
, то берется значение атрибутов только у первого элемента, а остальные проигнорируются.
Закрывающий тег не требуется.
Правила написания тега base
<head>
<base атрибуты>
</head>
Атрибуты HTML тега base
- href — адрес, который должен использоваться для указания полного пути к файлам.
- target — имя окна или фрейма, куда будет загружаться документ, открываемый по ссылке.
Пример с тегом base
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>Тег base</title> <base href="http://site.ru/base/"> </head> <body> <p><a href="download.php">скачать</a></p> </body> </html>
Результат примера вы можете увидеть на рисунке ниже. Обратите внимание, каким стал адрес ссылки благодаря тегу
base
.
HTML тег base | назначение, синтаксис, атрибуты, примеры
Последнее обновление: 24.02.2009
Тег <base> (с англ. база, основа) указывает полный базовый адрес документа. Применяется для составления относительных адресов и для указания целевого окна всех ссылок страницы.
HTML: 3.2 | 4 / XHTML: 1.0 | 1.1
Синтаксис
<head>
<base href=". . ."/>
</head>
Атрибуты
href | задает базовый адрес документа |
---|---|
target | имя окна или фрейма, куда будут открываться документы по ссылкам с текущей страницы. Зарезервированные имена:
|
Пример
Задаем базовый адрес для документа:
<head>
<base href="http://mysite. com/"/>
</head>
...
<a href="test.html">ссылка</a>
<img src="img.jpg" alt="" />
При такой записи адреса на сайте у ссылки и картинки будут такие: http://mysite.com/test.html
http://mysite.com/img.jpg
Открывать все ссылки в новом окне
<base target="_blank"/>
Рекомендации по использованию
- должен быть закрыт (<base…/>)
- должен находиться в секции <head> перед любым элементом, ссылающимся на внешний ресурс.
- должен быть только один на странице
- атрибут href является обязательным для XHTML 1.0 Strict, XHTML 1.1
Гиперссылки, ссылки на изображения, аплеты, программы обработки форм, таблицы стилей определяются в URI (Uniform Resource Identifiers). Относительные URI расширяются в соответствии с базовым URI, который может задаваться явным образом с помощью тега base.
Тег <base> рекомендуется использовать для уменьшения объема страниц, за счет того, что не нужно писать полные адреса в ссылках, изображениях, скриптах и объектах.
Твой код:
<html> <head> <base target=»_blank»/> <title></title> </head> <body> <p><a href=»http://google.com/»>ссылка откроется в новом окне</a></p> </body> </html> Сделай код и жми тут
Результат:
большой полигонHTML тег в email
У нас есть контент-управляемое решение (SDL Tridion, если быть точным; однако вопрос более общий), которое включает в себя несколько сайтов с контентом на разных языках. Все они совместно используют ряд шаблонов на основе Razor, которые используются для визуализации фрагментов HTML с определенным введенным содержимым при публикации страниц.
CRM также управляется через CMS, и тот же шаблон используется для создания информационных бюллетеней email. Эти письма HTML содержат изображения, которые публикуются на любом сайте, управляющем данным списком рассылки. Поскольку система шаблонов является универсальной, а CMS не имеет понятия об абсолютном URLs конечного продукта, все эти изображения встроены с относительными адресами. У нас есть возможность применить абсолютный URL в качестве метаданных к различным веб-сайтам в CMS и написать расширения .Net для форматирования этих URLs в теги визуализированных изображений; однако это добавило бы значительные накладные расходы к этой части работы.
Мы можем решить эту проблему с помощью тега <base href="..." />
в разделе <head>
email markup. По крайней мере, это работает в Outlook; однако я не смог найти много информации о том, что делают клиенты email и не поддерживают этот тег.
Тогда вопрос: Насколько широко поддерживается среди клиентов email — особенно браузерных-тег <base>
?
Поделиться Источник Ant P 30 января 2013 в 18:33
2 ответа
-
альтернативный тег <base href=»»>
Можно ли иметь альтернативный тег <base> для условного использования? У меня есть стандарт: <base href=/ /> Но для одного маршрута было бы здорово, если бы я мог использовать базу href в качестве: <base href=/path/ /> Возможно ли это?
-
Yahoo email клиент: <ins> html тег
По-видимому, при отправке email, содержащего тег <ins> , клиенту Yahoo тег удаляется, включая его встроенный тег CSS.
Это странно, так как тег <del> остается в порядке. Кто-нибудь знает решение?
9
К сожалению, он не будет работать для большинства веб-клиентов email (Hotmail, Gmail), и это обычно составляет около 30% получателей.
Почему это не сработает:
Большинство веб-клиентов вводят все, что находится внутри тега тела вашего email, и удаляют все остальное, включая head
. Итак, если вы пошлете:
<html>
<head><base ...></head>
<body><p>Email</p></body>
</html>
Клиент email делает это:
<html>
<head><Email client head></head>
<body>
<email client wrapper>
<email>
<p>Email</p>
</email>
<email client wrapper>...
</body>
Таким образом, ваш базовый тег будет удален. Даже если бы это было не так, поскольку он не включен в голову клиента email, он будет проигнорирован браузером.
К сожалению, абсолютные пути на изображениях — это путь. Я преодолел подобные проблемы в прошлом, используя ‘preflight processor’. Вы можете использовать это, чтобы получить <base>
href и установить его на всех изображениях, прежде чем вернуть готовый HTML.
Поделиться Dan Blows 06 февраля 2013 в 09:57
0
Я не мог сказать, используете ли вы Razor или нет, но если да, то вы можете сделать это внутри представления razor:
src="@Request.Url.GetLeftPart(UriPartial.Authority)~/images/screenshot.png"
Поделиться toddmo 09 января 2017 в 21:50
Похожие вопросы:
Тег Html IFrame не интерпретируется в теле email
Мне нужно отправить файл html (который содержит iframe) внутри тела email. Файл html отлично работает в браузере и воспроизводит видео. Но когда я посылаю его внутрь тела email, тег iframe не…
Как обойти тег <base> ?
Возможный Дубликат : Как использовать переменную JavaScript в ссылке HTML Веб-сайт, над которым я работаю, имеет тег <base> , указывающий на предварительно установленный URL. Что я хотел бы…
Градиент SVG становится черным, когда на странице HTML есть тег BASE?
Я использую библиотеку Raphaël JavaScript для создания SVG элементов на странице HTML и использую CodeIgniter в качестве фреймворка PHP. В фреймворке CodeIgniter мне нужно добавить тег <base>…
альтернативный тег <base href=»»>
Можно ли иметь альтернативный тег <base> для условного использования? У меня есть стандарт: <base href=/ /> Но для одного маршрута было бы здорово, если бы я мог использовать базу href в…
Yahoo email клиент: <ins> html тег
По-видимому, при отправке email, содержащего тег <ins> , клиенту Yahoo тег удаляется, включая его встроенный тег CSS. Это странно, так как тег <del> остается в порядке. Кто-нибудь знает…
Исключить href из перенаправления HTML <BASE>
Я работаю над существующим приложением, которое по сути представляет собой очень большой файл .js внутри тонкой страницы HTML. Скрипт ссылается на большое количество файлов в каталоге assets/ через…
Определите тег BASE в html с помощью php
Я хочу определить тег BASE в html, используя PHP <!DOCTYPE html> <html lang=<?php echo LANG; ?>> <head> <meta charset=<?php echo CHARSET; ?>> <base…
Как защититься от тега HTML <base> ?
Документация о теге говорит, что он должен находиться внутри <head> , и только один тег <base> разрешен. Однако этот тег успешно заменяет базу URL для относительных ссылок, даже если он…
Тег Email и тег tel не работают в проекте laravel
В моем проекте laravel у меня есть карта google с маркерами, при нажатии на маркер их информация о местоположении будет отображаться в infowindow. Но для email и номера телефона я хочу добавить тег…
Что означает пустой тег href для html <base> ?
Предположим, что моя страница URL: http://example.com/path/to/dir/index.html И я проксирую эту страницу через: http://proxyserver.com/path/to/dir/index.html . Точно так же я хочу, чтобы все…
base html
Чем же удобен тег base и где мы можем его использовать? Ответ на этот вопрос вы сможете получить в данной статье.
Итак, тег base обычно располагают в теге head и используют один раз в контексте данного документа пример:
<base href="https://site.com/img/" target="_blank">
Как видите это одинарный тег. И он может содержать такие атрибуты как target и href.
Причем его можно указать только один раз в контексте данного документа, если мы укажем так:
<base href="https://site.com/img/" target="_blank">
<base href="https://site2.
com/img/" target="_blank">
Второй тег base будет проигнорирован.
При наличие атрибута href мы можем задавать полный путь при указании путей. Предположим я взял путь до директории иконок на сайте https://site.com если теперь в html коде я укажу:
<base href=" https://site.com/img/" >
<img src="1.jpg"/>
У нас подгрузится изображение по адресу https://site.com/img/1.jpg.
Однако тут следует понимать что все наши пути поменяются на https://site.com/img/ во всех атрибутах src и href имеющих относительные пути.
В результате все ссылки будут вести на адрес начинающийся с https://site.com/img/ и согласитесь это не совсем то что нам нужно.
Поэтому в атрибуте href тега base предпочтительнее указывать просто домен, так как он может содержаться во всех путях. За исключением путей(ссылок) на другие ресурсы.
<base href="https://webfanat.
com" target="_blank">
<img src="/view/assets/img/logo.png"/>
<a href="">Главная</a>
<a href="https://youtube.com">Ссылка на youtube</a>
Наводя курсор на ссылку ‘Главная’ мы можем наблюдать что нам подсвечивается домен указанный в атрибуте href тега base.
Заметьте ссылка на youtube корректно работает. То есть пути начинающиеся с протокола(http или https) base игнорирует и оставляет без изменений. Помимо атрибута href тег base можем принимать атрибут target. Данный атрибут предназначен прежде всего для ссылок. Обычно он используется в ссылках.
Если к примеру мы укажем значение target=»_blank»:
<base href="https://webfanat.com" target="_blank">
то все ссылки имеющие относительный путь в контексте данного документа будут открываться в новой вкладке.
В общем вы можете использовать данный тег для преобразования относительных путей в полные.
На этом данная статья подошла концу.
Желаю удачи и успехов! Пока!
Метаданные HTML-документа
К метаданным относится содержимое, которое устанавливает представление или поведение остального содержимого, отношения документа с другими документами, или передает другую «внешнюю» информацию.
HTML-элементы, семантика которых связана с метаданными
1. Элемент <head>
Категории содержимого: нет.
Контекст, в котором этот элемент может быть использован: как первый элемент в элементе <html>.
Пропуск тегов: начальный тег <head> может быть пропущен, если элемент <head> пуст, или если сразу после него идет другой HTML-элемент. Закрывающий тег </head> может быть пропущен, если он не следует сразу за пробелом или за комментарием.
<!DOCTYPE html>
<html lang="ru">
<title>Тест</title>
<body>
<h2>Тестовая страница</h2>
</body>
Для элемента доступны глобальные атрибуты.
Раздел <head>...</head> содержит набор технической информации (метаданных) о текущей веб-странице: заголовок, описание, ключевые слова для поисковых машин, кодировку и т.д. Введенная в нем информация не отображается в окне браузера, однако содержит данные, которые указывают браузеру, как следует обрабатывать страницу.
Набор метаданных может быть как большим, так и маленьким:
<!DOCTYPE html>
<html lang="ru">
<head>
<title>Документ с небольшим head</title>
</head>
<body>
...
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<title>Документ с большим head</title>
<link rel="stylesheet" href="default.css">
<link rel="stylesheet alternate" href="big.css" title="Большой текст">
<script src="main.js"></script>
</head>
<body>
.
..
2. Элемент <title>
Категории содержимого: метаданные.
Контекст, в котором этот элемент может быть использован: в элементе <head>, не содержащем других элементов <title>.
Пропуск тегов: ни один из тегов не может быть пропущен.
Для элемента доступны глобальные атрибуты.
Элемент <title> представляет заголовок или название документа (веб-страницы). Авторы должны использовать заголовки, которые дают поисковой системе понять, что содержится на странице, даже если заголовки используются вне контекста, например, в истории, закладках пользователя или в результатах поиска. Заголовок документа может отличаться от заголовка первого уровня, поскольку <h2> не должен стоять отдельно, когда он вырван из контекста.
<title>Подробное руководство по Flexbox</title>
...
<h2>Что такое Flexbox</h2>
<p>.
..</p>
Текст внутри <title> отображается браузером в заголовке окна. Также этот текст будет содержать ссылку на ваш сайт на странице результатов поиска. Длина заголовка должна быть не более 60 символов, чтобы поместиться полностью.
В одном документе должно быть не более одного элемента <title>. Элемент <title> является обязательным в большинстве ситуаций, но если протокол более высокого уровня предоставляет информацию о заголовке, например, в строке «Тема» электронного письма, когда HTML используется в качестве формата создания электронного письма, элемент <title> может быть опущен.
3. Элемент <base>
Категории содержимого: метаданные.
Контекст, в котором этот элемент может быть использован: в элементе <head>, не содержащем других элементов <base>.
Пропуск тегов: отсутствует закрывающий тег.
Для элемента доступны глобальные атрибуты.
Элемент <base> с помощью атрибута href предоставляет базовый URL документа для парсинга всех относительных URL-адресов на странице, установленных атрибутами src и href.
Атрибут target задает тип окна просмотра по умолчанию при переходе по всем гиперссылкам.
В одном документе может быть только один элемент <base> и он должен иметь атрибут href, target или оба сразу.
Элемент <base> должен находиться перед любыми другими элементами в дереве, которые имеют атрибуты, определенные как принимающие URL, кроме элемента <html> (его атрибут manifest не подвержен влиянию элемента <base>).
<!DOCTYPE html>
<html lang="ru">
<head>
<title>Пример для элемента base</title>
<base href="https://www.example.com/news/index.html">
</head>
<body>
<p>Посетите страницу <a href="archives.
html">архивов</a>.</p>
</body>
</html>
Ссылка в приведенном выше примере будет ссылкой на https://www.example.com/news/archives.html.
4. Элемент <link>
Категории содержимого: метаданные. Если его использование разрешено в <body> — потоковое или текстовое содержимое.
Контекст, в котором этот элемент может быть использован: где ожидаются метаданные. В элементе <noscript>, который является дочерним элементом элемента <head>. Если элемент разрешен в <body> — там, где ожидается текстовое содержимое.
Пропуск тегов: отсутствует закрывающий тег.
Для элемента доступны глобальные атрибуты, а также атрибуты, приведенные в таблице:
Атрибут | Описание, принимаемое значение |
---|---|
href | Задает адрес гиперссылки.![]() |
crossorigin | Описывает, как элемент обрабатывает CORS-запросы, предназначен для использования со ссылками на внешние ресурсы. |
rel | Задает тип указанной ссылки, может содержать как одно значение, так и набор разделенных пробелами ключевых слов: alternate, dns-prefetch, icon, next, pingback, preconnect, prefetch, preload, prerender, search, serviceworker. |
rev | Описывает обратное отношение текущего документа к связываемому документу, как определено атрибутом href. |
media | Указывает, к какому типу медиа относится ресурс. Значение должно быть допустимым списком медиазапросов. |
nonce | Используется в проверках политики безопасности контента, представляет криптографический одноразовый номер, который может использоваться политикой безопасности содержимого, чтобы определить, будет ли внешний ресурс, указанный в ссылке, загружаться и применяться к документу.![]() |
hreflang | Задает язык связанного ресурса. |
type | Устанавливает подсказку для типа ссылочного ресурса. |
referrerpolicy | Указывает URL источника запроса при переходе с одной страницы на другую. |
sizes | Задает размеры иконок (для rel="icon") для визуальных медиа, значение носит рекомендательный характер. |
title | Устанавливает заголовок ссылки, альтернативное имя таблицы стилей. |
Атрибут href элемента <link> позволяет связывать HTML-документ с различным видами ресурсов, например, таблицами стилей, скриптами, альтернативными формами документа и ссылками навигации (оглавление, предыдущие и последующие страницы, уведомления об авторских правах и т.п.).
Тип связанного ресурса задается значением обязательного атрибута rel.
С помощью элемента <link> можно создать две категории ссылок: ссылки на внешние ресурсы и гиперссылки. Например, следующий элемент ссылки создает две гиперссылки (на одну и ту же страницу):
<link rel="author license" href="/about">
Семантика первой состоит в том, что целевая страница содержит информацию об авторе текущей страницы, семантика второй заключается в том, что целевая страница содержит информацию о лицензии, под которой предоставляется текущая страница.
Гиперссылки, созданные с помощью элемента <link> и его атрибута rel, применяются ко всему документу. Это отличается от атрибута rel элементов <a> и <area>, который указывает тип ссылки, контекст которой определяется местоположением ссылки в документе.
Если значения атрибута rel содержат только ключевые слова, разрешенные в <body>, элемент <link> можно использовать там, где ожидается фразовое содержание, то есть внутри <body>.
5. Элемент <meta>
Категории содержимого: метаданные.
Контекст, в котором этот элемент может быть использован: если для элемента указаны атрибуты charset и http-equiv, то в элементе <head>. Если значением атрибута не является content-type, то внутри элемента <noscript>, являющимся дочерним элементом <head>. Если присутствует атрибут name — там, где ожидаются метаданные.
Пропуск тегов: отсутствует закрывающий тег.
Для элемента доступны глобальные атрибуты, а также атрибуты, приведенные в таблице:
Атрибут | Описание, принимаемое значение |
---|---|
charset | Определяет кодировку символов, используемую в документе. В документе должен быть один элемент <meta> с атрибутом charset. Необходимо использовать utf-8 или другую кодировку, совместимую с ASCII. |
content | Задает значение метаданных документа или прагма директив.![]() |
http-equiv | Задает прагма директиву. |
name | Устанавливает название/имя метаданных документа. |
Элемент <meta> представляет различные виды метаданных, которые не могут быть выражены с использованием элементов <title>, <base>, <link>, <style> и <script>.
Для элемента обязательно должен быть определен один из атрибутов — name, http-equiv или charset. Если указан атрибут name или http-equiv, также должен присутствовать атрибут content (или пропущен, если нет соответствующих значений).
Стандартные названия метаданных
Для атрибута name доступны следующие значения (чувствительны к регистру):
-
application-name — значение должно быть короткой строкой произвольной формы, содержащей название веб-приложения, которое представляет страница.
Если страница не является веб-приложением, application-name не должно использоваться. В одном документе должно быть не более одного названия веб-приложения.
Браузеры могут использовать название веб-приложения в пользовательском интерфейсе вместо <title>, поскольку <title> может содержать сообщения о состоянии и тому подобное, относящиеся к состоянию страницы в определенный момент времени, а не просто как название приложения.
- author — значение должно быть строкой произвольной формы с указанием имени одного из авторов страницы.
- description — значение должно быть строкой произвольной формы, описывающей страницу. Значение должно быть подходящим для использования в каталоге страниц, например, в поисковой системе.
-
generator — значение должно быть строкой произвольной формы, которая идентифицирует один из пакетов программного обеспечения, использованных для создания документа.
Это значение не должно использоваться на страницах, разметка которых не создается программным обеспечением, например на страницах, разметка которых была написана пользователем в текстовом редакторе.
<meta name="generator" content="WordPress 5.2">
-
keywords — значение должно быть набором разделенных запятыми ключевых слов, относящихся к странице. Многие поисковые системы не рассматривают такие ключевые слова, потому что эта функция исторически использовалась ненадежно и спамила результаты поиска.
<meta name="keywords" content="шрифт,шрифты,типографика">
-
referrer — необязательное поле заголовка HTTP, которое позволяет отслеживать перемещения пользователей между страницами в инструментах аналитики, а также понять происхождение входящего трафика. Реферер передаётся при переходе с http на любой тип сайта, при переходе с https на https, и не передаётся при переходе с https на http.
В наиболее распространенной ситуации это означает, что когда пользователь щелкает гиперссылку в браузере, на сервер отправляется запрос, содержащий целевую веб-страницу. Запрос может содержать поле referer, в котором указана последняя страница, на которой был пользователь (то есть та, на которой он щелкнул ссылку).
Значения атрибута content:
- no-referrer — не передает никакую информацию о реферере.
- no-referrer-when-downgrade — передает реферальные данные только сайтам на HTTPS. Поведение браузера по умолчанию, если не указано иное.
- unsafe-url — всегда передает полный URL реферера.
- origin-when-cross-origin — отправляет полный URL при переходе на страницы в рамках одного сайта, вне зависимости от протокола, а на все остальные — только базовый домен/поддомен.
<meta name="referrer" content="origin-when-cross-origin">
-
viewport — позволяет определять конкретные характеристики области просмотра, например, ширину макета и коэффициент масштабирования веб-страниц.
Можно запретить или ограничить пользователям возможность масштабирования, используя такие значения, как content="user-scalable=no" или content="width=device-width, initial-scale=1.0, maximum-scale=1.0".
Могут быть конкретные случаи использования, в которых целесообразно предотвращение масштабирования пользователями, например, приложения-карты — когда пользовательские функции масштабирования обрабатываются с помощью сценариев, но в целом такой практики следует избегать.
Распознаваемые свойства атрибута content:
-
width — определяет ширину области просмотра, значением может быть определенное количество пикселей, например, width=768 или ключевое слово device-width (соответствует 100vw).
<meta name="viewport" content="width=device-width, initial-scale=1">
- height — определяет высоту области просмотра, значением может быть определенное количество пикселей, например, height=480 или ключевое слово device-height (соответствует 100vh)
- initial-scale — указывает браузеру соотношение пикселей CSS и устройства.
- minimum-scale — определяет наименьший допустимый коэффициент масштабирования.
- maximum-scale — определяет максимально допустимый коэффициент масштабирования.
- user-scalable — указывает, может ли коэффициент масштабирования быть изменен в результате взаимодействия с пользователем или нет.
-
Прагма директивы
Когда атрибут http-equiv указан в элементе <meta>, элемент <meta> является прагма директивой, которая предоставляет дополнительную информацию о документе:
-
content-type — является альтернативной формой установки атрибута charset.
<meta http-equiv="content-type" content="text/html; charset=utf-8">
-
default-style — задает имя альтернативной таблицы стилей, используемой по умолчанию.
<meta http-equiv="default-style" content="default">
-
refresh — устанавливает таймер для обновления и перенаправления.
Например, главная страница новостного сайта может содержать следующую разметку в элементе <head>, чтобы обеспечить автоматическую перезагрузку страницы с сервера каждые пять минут:
<meta http-equiv="refresh" content="300">
Последовательность страниц может использоваться в качестве автоматического слайд-шоу, если каждая страница обновляется до следующей страницы в последовательности с использованием следующей разметки:
<meta http-equiv="refresh" content="20; url=page4.html">
-
content-security-policy — позволяет настроить политику защиты содержимого, с помощью которой можно защищаться, например, от межсайтового скриптинга:
<meta http-equiv="content-security-policy" content="script-src 'self'">
6. Элемент <style>
Категории содержимого: метаданные.
Контекст, в котором этот элемент может быть использован: где ожидаются метаданные. Внутри элемента <noscript> который является дочерним элементом <head>. Внутри <body>, где ожидается потоковое содержимое.
Пропуск тегов: ни один из тегов не может быть пропущен.
Для элемента доступны глобальные атрибуты, а также атрибуты, приведенные в таблице:
Атрибут | Описание, принимаемое значение |
---|---|
media | Указывает, к каким медиа применяются стили. Значение должно быть допустимым списком медиазапросов. Браузер должен применять стили, когда значение атрибута media соответствует среде и применяются другие соответствующие условия. Если атрибут media пропущен, по умолчанию он принимает значение all, то есть стили применяются ко всем видам медиа. |
nonce | Представляет криптографический одноразовый номер, который может использоваться политикой безопасности содержимого, чтобы определить, будет ли стиль, указанный элементом, применяться к документу.![]() |
type | Устанавливает язык таблиц стилей, значение должно быть допустимым MIME-типом. Значением по умолчанию является text/css. |
title | Задает альтернативное имя таблиц стилей. |
Элемент <style> позволяет авторам встраивать информацию о стилях в свои документы. Элемент не представляет какое-либо содержимое для пользователя.
Элемент <style> желательно использовать внутри раздела <head>.
<!DOCTYPE html>
<html>
<head>
<title>Моя любимая книга</title>
<style>
em {
font-style: normal;
color: red;
}
</style>
</head>
<body>
<p>Моя <em>любимая</em> книга - «Приключения Алисы в Стране чудес».</p>
</body>
</html>
По материалам Document metadata
HTML Tag »
Раскрытие: Ваша поддержка помогает поддерживать работу сайта! Мы зарабатываем реферальный сбор за некоторые услуги, которые мы рекомендуем на этой странице.
- Элемент
- HTML-привязок: как создавать ссылки для быстрой навигации
- Что делает
HTML-тег - Элемент
используется для идентификации базового URL-адреса, на основе которого строятся все относительные URL-адреса, появляющиеся на веб-странице. Кроме того, если элемент имеет целевой атрибут, целевой атрибут будет использоваться как атрибут по умолчанию для всех гиперссылок, появляющихся в документе. - Дисплей
- нет
- Нулевой элемент
- Этот элемент не должен содержать никакого содержимого и не требует закрывающего тега.
Код примера
.
.
.
Относительные ссылки
При создании ссылки привязки атрибут href
может указывать абсолютный URL-адрес, например http://example.com
, или относительный URL-адрес, например /
, / page-name
или имя страницы
.
В относительных URL-адресах косая черта (/
) указывает корневой URL-адрес текущей страницы, поэтому href = "/ page-name"
будет ссылаться на страницу в currentdomain / page-name
. Если опустить косую черту, это приведет к переходу на подстраницу текущего URL-адреса, поэтому href = "page-name"
будет ссылаться на current_url / page-name
.
Используя элемент
, вы можете изменить базовый URL-адрес, используемый относительными ссылками на странице.Вместо текущего фактического URL-адреса текущей страницы все относительные ссылки будут основаны на URL-адресе, указанном в атрибуте href
элемента
.
Для получения дополнительной информации о том, как работают относительные ссылки, см. Нашу документацию по URL-адресам якорных ссылок.
По умолчанию
target
value Помимо указания базового URL-адреса для относительных ссылок, элемент
позволяет вам указать значение target
по умолчанию для всех ссылок на странице. Итак, если вы установите
target = "_ blank"
в элементе
, все ссылки на странице (относительные и абсолютные) будут открываться в новом окне, если не указано иное.
Размещение и ограничения
Элемент
должен быть размещен внутри документа
, и в документе должен быть только один элемент
. Элемент
не должен иметь содержимого и не требует закрывающего тега.
Браузер Поддержка базы
Атрибуты базы
Имя атрибута | Значения | Примечания |
---|---|---|
цель | Задает целевое значение по умолчанию для всех якорных ссылок в текущем документе. | |
href | Задает базовый URL-адрес, который будет использоваться для всех относительных ссылок в текущем документе.![]() |
contextpath — Каковы рекомендации для тега html?
Прежде чем решить, использовать ли тег
или нет, вам необходимо понять, как он работает, для чего его можно использовать и каковы последствия и, наконец, перевесить преимущества / недостатки.
Тег
в основном упрощает создание относительных ссылок в языках шаблонов, поскольку вам не нужно беспокоиться о текущем контексте в каждой ссылке .
Можно например
...
...
домой
часто задаваемые вопросы
контакт
...
вместо
...
главная
часто задаваемые вопросы
контакт
...
Обратите внимание, что значение
заканчивается косой чертой, иначе оно будет интерпретировано относительно последнего пути.
Что касается совместимости браузеров, то это вызывает проблемы только в IE.Тег
указан в HTML как , а не с конечным тегом
, поэтому можно просто использовать
без конечного тега. Однако IE6 думает иначе, и все содержимое после тега
в таком случае помещается как дочерний элемент элемента
в дереве HTML DOM. Это может вызвать на первый взгляд необъяснимые проблемы в Javascript / jQuery / CSS, то есть полностью недоступные элементы в определенных селекторах, таких как html> body
, пока вы не обнаружите в инспекторе HTML DOM, что должно быть base
(и голова
) между ними.
Обычное исправление IE6 — использование условного комментария IE для включения конечного тега:
Если вас не волнует W3 Validator, или когда вы уже используете HTML5, вы можете просто закрыть его, каждый веб-браузер все равно его поддерживает:
Закрытие тега
также мгновенно устраняет безумие IE6 в WinXP SP3 для запроса ресурсов