HTML тег head
Элемент <head> является контейнером для всех головных элементов документа. В головной части HTML документа содержится информация об этом документе — заголовок документа, скрипты, стили, мета информация и т.д. Внутри элемента <head> могут использоваться элементы <title>, <meta>, <style>, <script>, <noscript>, <base> и <link>.
Элемент <head> может использоваться только один раз на странице. Появляться он должен сразу же после открывающего тега <html> и заканчивается непосредственно перед открывающим тегом <body>.
Разница между HTML 4.01 и HTML5
В HTML 4.01 тег <head> является обязательным.
В HTML5 элемент <head> может быть опущен. Следующий код успешно пройдет валидацию:
<!DOCTYPE html>
<html>
<title>Заголовок документа</title>
<body>
<h2>Это текстовое заглавие</h2>
<p>Это текстовый параграф.</p>
</body>
</html>
Атрибуты тега <head>
Атрибут | Описание |
---|---|
profile | Определяет адрес профиля метаданных |
Общие атрибуты
Тег <head> поддерживает общие атрибуты.
HTML пример
HTML документ с тегом <title> внутри секции заголовка:
<!DOCTYPE html>
<html>
<head>
<title>Заголовок документа</title>
</head>
<body>
Содержимое документа......
</body>
</html>
CSS стили по умолчанию
Большинство браузеров будут отображать тег <head> со следующими стилями
head {
display: none;
}
seodon.ru | Теги HTML — Тег HEAD
Опубликовано: 25.06.2010 Последняя правка: 10.12.2015
Тег <HEAD> предназначен для содержания элементов с информацией о текущей странице, так называемая «шапка» HTML-документа. Данная информация используется браузерам и поисковыми машинами для правильной обработки страницы. Это могут быть теги содержащие название веб-страницы, кодировку, ключевые слова, файлы данных и т.д.
Содержимое элемента <HEAD> не отображается на странице, исключением является тег <TITLE>, который указывает название окна текущего документа.
Хотя тег <HEAD> и не обязателен (браузер сам определит, где находится «шапка» HTML-документа), все же принято его указывать всегда.
Атрибуты
Личные атрибуты: нет.
Общие атрибуты:
- accesskey — устанавливает клавишу быстрого доступа для фокусировки на HTML-элементе.
- class — задает имя класса или классов тега, используемых в CSS (Каскадные таблицы стилей).
- dir — указывает направление текста внутри элемента.
- id — задает имя идентификатора HTML-тега, который может использоваться в качестве «якоря» или в таблицах стилей.
- lang — указывает язык, на котором написан текст внутри HTML-элемента.
- style — необходим для применения встроенных стилей CSS к тегу.
- tabindex — устанавливает порядок табуляции между элементами (клавиша Tab).
- title — выводит всплывающую подсказку при наведении курсора мыши на HTML-элемент.
Тип тега
Назначение: документ.
Модель тега: может располагаться сразу после открывающего тега <HTML>.
Должен содержать: тег <TITLE>.
Может содержать: один тег <BASE>, <ISINDEX>, а также теги: <BGSOUND>, <LINK>, <META>, <OBJECT>, <SCRIPT>, <STYLE>.
Открывающий тег: не обязателен. Закрывающий тег: не обязателен.
Синтаксис
<head>содержимое</head>
Пример HTML: применение тега HEAD
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Название документа</title>
<meta name="keywords" content="ключевые слова">
<meta name="description" content="описание документа">
<link rel="stylesheet" type="text/css" href="files/style.css">
</head>
<body>
<p>Тело документа. Текст оформлен с помощью стилей в файле style.css.</p>
</body>
</html>
Результат примера
Поддержка версиями HTML
Версия: | HTML 4.01 | HTML 5 | XHTML 1.0 | XHTML 1.1 |
Поддержка: | Да | Да | Да | Да |
Поддержка браузерами
Браузер: | Internet Explorer | Google Chrome | Mozilla Firefox | Opera | Safari |
Версия: | 6.0 и выше | 2.0 и выше | 2.0 и выше | 9.2 и выше | 3.1 и выше |
Поддержка: | Да | Да | Да | Да | Да |
Тег | HTML справочник
HTML тегиЗначение и применение
Следующие HTML теги используются для разделения таблицы на части:
- Тег <thead> используется для содержания заголовка группы в таблице («шапка таблицы», не путайте с заголовками).
- Тег <tfoot> используется для содержания «подвала» таблицы (футер).
- Тег <tbody> используется для содержания «тела» таблицы (боди).
Элемент <thead> должен быть использован только один раз в одной таблице в следующем контексте: в составе элемента <table> (как дочерний (вложенный) элемент), при наличии тегов <caption> (наименование таблицы) и <colgroup> (определяет группу столбцов в таблице) должен следовать после этих элементов, но прежде, чем любой тег <tbody>, <tfoot> и <tr>. Кроме того, элемент <thead> должен иметь один или более тегов <tr> внутри (контейнер для создания строки).
Элементы <thead>, <tbody> и <tfoot> не влияют на расположение таблицы по умолчанию. Тем не менее, с использованием CSS, вы сможете стилизовать эти элементы по своему усмотрению.
Поддержка браузерами
Атрибуты
Атрибут | Значение | Описание |
---|---|---|
align | left right center justify char | Не поддерживается в HTML5. Выравнивает содержимое внутри элемента. |
char | character | Не поддерживается в HTML5. |
charoff | number | Не поддерживается в HTML5. Атрибут, который позволяет произвести выравнивание в элементе с символа, указанного в атрибуте, путем смещения от определённого символа вправо (положительные значения) или влево (отрицательные значения). Атрибут charoff может быть использован только если атрибут align = «char». |
valign | top bottom baseline middle | Не поддерживается в HTML5. Вертикальное выравнивание содержимого внутри элемента. |
Пример использования
<!DOCTYPE html> <html> <head> <title>Пример использования тега <thead></title> </head> <body> <table> <thead> <tr> <th>Услуга</th><th>Стоимость</th> </tr> </thead> <tfoot> <!-- Тег <tfoot> применяется для создания подвала таблицы. Его принято писать после тега<thead>, но отображается он в самом низу таблицы. --> <tr> <td>Сумма</td><td>3 000</td> </tr> </tfoot> <tbody> <tr> <td>Чтение в слух</td><td>1 000</td> </tr> <tr> <td>Игра на перфораторе</td><td>2 000</td> </tr> </tbody> </table> </body> </html>
Результат нашего примера:
Пример использования тегов <thead>, <tbody> и <tfoot>.Отличия HTML 4.01 от HTML 5
В HTML 5 были удалены все атрибуты тега.Значение CSS по умолчанию
thead { display: table-header-group; vertical-align: middle; border-color: inherit; }
Поддержка глобальных атрибутов
Элемент поддерживает «глобальные атрибуты».
Атрибуты событий
Элемент поддерживает «атрибуты событий».
HTML тегиhead — Xiper.net
Тег <head> (с англ. голова) — тег-контейнер, заголовок документа, содержит информацию о текущем документе:
- название документа
- инструкции браузеру по отображению страницы
- ключевые слова и описание страницы для поисковых машин
- подключения внешних файлов таблиц стилей и скриптов
- описания внутренних таблиц стилей и скриптов
HTML: 3.2 | 4 / XHTML: 1.0 | 1.1
Синтаксис
<head>...</head>
Атрибуты
dir | определяет направление символов:
|
---|---|
lang | определяет язык отображаемого документа |
profile | указывает расположение профилей метаданных, разделенных пробелами |
Пример
Шаблон странички
<html>
<head>
<title>Тег head | назначение, синтаксис, параметры, примеры</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<meta name="Keywords" content="HTML справочник, CSS справочник, HTML приемы" />
<link href="css/stylesheet.css" rel="stylesheet" type="text/css"/>
<script src="js/jquery.js" type="text/javascript"></script>
</head>
<body>
Тело документа
</body>
</html>
Рекомендации по использованию
- обязательный тег
- должен быть закрыт (</head>)
- по умолчанию браузерами содержимое тега не отображается на странице
- должен находиться между тегами <html> и <body> или <frameset>
- тег <head> должен содержать обязательный тег <title>
- дополнительно может содержать теги: <base>, <link>, <meta>, <script>, <style>, а так же отсутствующие в стандартах, не рекомендуемые теги <bgsound> и <sound>
- обязательных атрибутов нет
Твой код:
<html> <head> <title>Заголовок страницы</title> </head> <body> <div>…тело документа…</div> </body> </html> Сделай код и жми тут
Результат:
большой полигонПо теме
Основы HTML. Секция head | Генеральский чай
При взгляде на структуру HTML документа, видно, что она состоит из трех основных секций.
- <html> – корень любого HTML документа, в котором располагаются все остальные секции (данный тег должен быть в единственном экземпляре, и должен присутствовать на каждой странице).
- <head> – заголовок в котором прописывается служебная информация и инструкции браузеру, по отображению контента.
- <body> – основная секция в которой находится контент, то есть вся полезная информация (текст, картинки, видео). Помимо контента, в этой секции расположена сетка сайта, либо его макет – описано местоположения основных разделов сайта, таких как: шапка, подвал, главное меню, боковые колонки, и т.д.
Тег <html> ничем особым не отличается, кроме того, что это есть корневой элемент – контейнер для всех остальных блоков. Поэтому приступим к более детальному рассмотрению секции <head>.
Элементы данной секции напрямую не показываются на веб странице. Единственный тег из данной секции, который будет отображать информацию – это тег <title>. В теге <title>, секции <head>, прописывается заголовок веб-страницы этот текст будет выведен в строке заголовка окна браузера.
<html> <head> <title>Заголовок, будет выведен в строке заголовка браузера</title> </head> <body> <!—Тут будет размещен контент—> </body> </html>
Данный тег является единым обязательном тегом в секции <head>.
Кроме тега <title>, в этой секции можно размещать следующие теги: <link>, <meta>, <script>, <style>.
Тег <link>
Этот тег указывает браузеру где находятся некие внешние ресурсы, например, внешние стили (CSS). Также при помощи тега <link> и указания соответствующего атрибута rel, можно указать адрес канала RSS, фавиконку для сайта, и другие внешние ресурсы.
<head> <link rel="stylesheet" type="text/css" href="theme.css" /> <link rel="alternate" type="application/rss+xml" title="Генеральский чай" href="http://generaltea.ru/feed/"> <link rel="shortcut icon" href="http://generaltea.ru/favicon.ico"> </head>
Тег <meta>
Это универсальный тег, который описывает данные. Тег <meta> предоставляет метаданные о документе HTML браузеру. Метаданные, не отображаются, а только используются для служебных целей, либо движком браузера, либо поисковыми пауками. Мета элементы, как правило, используется для описания страницы (description), указания ключевых слов (keywords), указание автора документа (author), указания типа контента и его кодировки, и другие метаданные.
<head> <meta name="description" content="Описание отсюда, выводится поисковиками" /> <meta name="keywords" content="HTML,CSS,верстка" /> <meta name="author" content="Sergii Mykhailov" /> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> </head>
Тег <script>
С помощью данного тега, можно указать браузеру, где он должен искать внешние скрипты:
<head> <script type="text/javascript" src="http://generaltea.ru/wp-includes/js/jquery/jquery-v1.4.2.js"> </script> </head>
либо же, вставить скрипт прямо в данную секцию:
<head> <script type="text/javascript"> document.write("Hello World!") </script> </head>
Тег <style>
Данный тег можно использовать, для того, чтобы задать стили, необходимые, только для этой странички, а также, если нету необходимости подключать внешний файл стилей, при помощи тега <link>. Можно задавать более чем один тег <style>
<head> <style type="text/css"> h2 {color: red} p {color: blue} </style> </head>
Вот и вся информация, которую необходимо знать о секции <head>. Далее будем рассматривать секцию <body>, которая будет содержать основной контент веб странички.
HEAD интернет-страницы. Что это такое, для чего предназначен | Web-Creature
Все теги, которые расположены между <head> и </head> — это что-то вроде служебной технической информации. Взять для примера тег <title> — это заголовок. Для чего он, спросите Вы?
Откройте браузер и взляните поверх всех командных строк (именно, на заглавие окна)… Увидели?
Элемент HEAD (обозначенный тегами <head> и </head>) размещается непосредственно перед телом HTML-документа, которое определяется тегами <body> и </body> (смотрите структуру документа HTML).
Между тегами <head> и </head> могут находиться такие составляющие:
HEAD — определяет начало и конец элемента, внутри которого, находится вся служебная информация, предназначенная для браузера.
TITLE — указывает имя документа (интернет-страницы), которое отображается в окне обозревателя (браузера). Может быть указан, но не более одного раза.
BASE — определяет базовый адрес, от которого, в последствии, отсчитываются относительные ссылки внутри Вашего документа. Не имеет закрывающего тега </>. При этом, обязательным моментом здесь, является наличие хотя бы одного из параметров (атрибутов):- HREF — определяет базовый адрес (URL) интернет-страницы;
- TARGET — определяет фрейм (его имя), который будет использован в гиперссылках по умолчанию.
Пример.
<HEAD>
<!— Пускай браузер думает, что он находится по адресу: —>
<BASE HREF=»http://web-creature.net»>
<TITLE>Создание сайта</TITLE>
</HEAD>
…
<!— А вот теперь давайте создадим относительную ссылку на наш документ —>
<!— http://web-creature.net/html/golova-head-html-stranicy.html —>
<A HREF=»…/golova-head-html-stranicy.html»>Список</A>
…
STYLE — служит для вставки в документ каскадной таблицы стилей CSS (Cascade Style Sheet).
Имеет такие атрибуты:
- TYPE — определяет MIME-тип интегрируемой таблицы стилей. Является обязательным атрибутом и, как правило, имеет значение «text/css».
- TITLE — определяет название каскадной таблицы стилей. В нем возникает необходимость, если планируют использовать в одном документе несколько правил STYLE. При этом, браузер будет вынужден спросить, какой именно из предложенных стелей будет применим к документу. Все современные браузеры игнорируют этот атрибут — можна не использовать.
Пример.
<HEAD>
<TITLE>Использование таблицы стилей CSS</TITLE>
<!— Вставляем таблицу стилей —>
<STYLE TYPE=»text/css» TITLE=»Great table»>
<!—
A {text-decoration : none;}
P {color : blue; font-size : 14pt; font-family : Verdana;}
h2 {color : green; font-size : 16pt;}
— >
</STYLE>
<!— … конец таблицы CSS —>
</HEAD>
LINK — определяет взаимосвязь Вашего документа с иными объектами. Не имеет закрывающегося тега.
Атрибуты
- HREF — определяет URL документ (интернет-страницы).
- REL — определяет как взаимосвязан документ с объектом, который определен параметром HREF. Может иметь такие значения:
- stylesheet — указывает на файл, котрый содержит таблицу стилей CSS. Браузер загрузит css-файл с адреса, указанного в параметре HREF и потом применит его к документу.
- home — указывает на главную страницу сайта.
- toc, contents — указывают на файл, который содержит оглавление документа.
- index — указывает на файл, котрый содержит информацию для индексного поиска по документу.
- glossary — указывает на файл который, содержит перечень терминов, что относятся к документу.
- copyright — указывает на страницу сайта, в которой предоставлена информация о авторских правах, его создателях и т.п.
- up, parent — указывает на «родительскую» страницу (страницу, которая стоит на ступеньку выше всех страниц).
- child — указывает на «дочернюю» страницу (страницу, которая стоит на ступеньку ниже определенной).
- next — указывает на следующую страницу.
- previous — указывает на предыдущую страницу.
- last, end — указывает на последнюю страницу.
- first — указывает на первую страницу.
- help — указывает на страницу с подсказкой.
- TYPE — определяет MIME-тип для объекта, указанного в параметре HREF.
Примеры.
<HEAD>
<TITLE>Элемент DIV</TITLE>
<LINK REL=»HOME» TITLE=»HTML-справочник» HREF=»index.html»>
<LINK REL=»UP» TITLE=»Текст» HREF=»textblocks.html»>
<LINK REL=»PREVIOUS» TITLE=»Элемент P» HREF=»p.html»>
<LINK REL=»NEXT» TITLE=»Элемент ADDRESS» HREF=»address.html»>
</HEAD>
<HEAD>
<TITLE>Полдневье</TITLE>
<LINK REL=»stylesheet» TYPE=»text/css» HREF=»dec3.css»>
</HEAD>
META — служит для вставки мета-данных. Этот тег позволяет вставлять в элемент HEAD разную полезную техническую информацию, которая, в итоге, не будет видна пользователю, но браузер ее распознает. Такая инфа просто необходима для правильной индексации страниц сайта поисковыми роботами (о них мы поговорим, когда наступит нужный момент в обучении). Не имеет закрывающегося тега.
Имеет в своем распоряжении такие атрибуты:
NAME — указывает имя мета-данных. Есть болшое количество предопределенных имен.
HTTP-EQUIV — указывает имя мета-данных. Он почти идентичен параметру NAME, но с одним отличием: используется лишь тогда, когда имеет место необходимость передачи дополнительной информации в http-заголовке.
CONTENT — присваивает значение мета-данным, определенным в параметре NAME (или HTTP-EQUIV).
А теперь — пример.
<HEAD>
…
<META HTTP-EQUIV=»Expires» CONTENT=»Sun, 29 Jun 2014 12:34:16 GMT»>
<META NAME=»GENERATOR» CONTENT=»Mike Blogger»>
<META NAME=»Publisher-Email» CONTENT=»[email protected]»>
<META NAME=»Publisher-URL» CONTENT=»Idea GraFix — http://web-creature.net»>
<META NAME=»Keywords» CONTENT=»http, css, php»>
<META NAME=»Description» CONTENT=»Как создать сайт и заработать на нем»>
</HEAD>
Популярность: 76%
Еще по этой теме…
Рейтинг: Загрузка …Просмотров: 4,011
Тег | htmlbook.ru
Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
4.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 |
Описание
Элемент <thead> предназначен для хранения одной или нескольких строк, которые представлены вверху таблицы. Допустимо использовать не более одного элемента <thead> в пределах одной таблицы, и он должен идти в исходном коде сразу после тега <table>.
Синтаксис
<table>
<thead>
<tr>
<td> ... </td>
</tr>
</thead>
<tfoot> ... </tfoot>
<tbody> ... </tbody>
</table>
Атрибуты
- align
- Определяет выравнивание текста в строке.
- char
- Выравнивание содержимого ячеек относительно заданного символа.
- charoff
- Смещение содержимого ячеек относительно указанного символа.
- bgcolor
- Цвет фона ячеек, которые расположены внутри контейнера <thead>.
- valign
- Выравнивание содержимого ячеек по вертикали.
Также для этого тега доступны универсальные атрибуты и события.
Закрывающий тег
Не обязателен.
Пример
HTML5IECrOpSaFx
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Тег THEAD</title>
</head>
<body>
<table>
<thead>
<tr>
<td> ... </td>
<td> ... </td>
</tr>
</thead>
<tbody>
<tr>
<td> ... </td>
<td> ... </td>
</tr>
</tbody>
</table>
</body>
</html>