HTML Главные теги
HTML элемент <head> контейнер для всех головных элементов:
<title>, <style>,
<meta>, <link>, <script>, и <base>.
HTML <head>
Элемент <head> представляет собой контейнер для метаданных (данных о данных) и помещается между ними.
Тег <html> и тег <body>.
Метаданные HTML - это данные о документе HTML. Метаданные не отображаются.
Метаданные обычно определяют заголовок документа, набор символов, стили, сценарии и другую метаинформацию.
HTML <title>
Элемент <title> определяет заголовок документа и является обязательным во всех HTML документах.
Элемент <title>:
- Определяет заголовок на вкладке браузера
- Предоставляет заголовок для страницы, когда она добавляется в избранное
- Отображает заголовок страницы в результатах поиска
Простой HTML документ:
Пример
<!DOCTYPE html>
<html>
<head>
<title>Заголовок страницы</title>
</head>
<body>
Содержание документа......
</body>
</html>
Попробуйте сами »
HTML <style>
Элемент <style> используется для определения информации о стиле для одной HTML страницы:
Пример
<style>
body {background-color: powderblue;}
h1 {color: red;}
p {color: blue;}
</style>
Попробуйте сами »
HTML <link>
Элемент <link> используется для связи с внешними таблицами стилей:
Совет: Чтобы узнать все о CSS, посетите CSS Учебник.
HTML <meta>
Элемент <meta> используется для указания используемого набора символов, описания страницы, ключевых слов, автора и других метаданных.
Метаданные используются браузерами (как отображать контент), поисковыми системами (ключевые слова) и другими веб службами.
Определение используемый набор символов:
<meta charset="UTF-8">
Определение описание вашей веб страницы:
<meta name="description" content="Бесплатные веб учебники">
Определение ключевых слов для поисковых систем:
<meta name="keywords" content="HTML, CSS, XML, JavaScript">
Определение автора страницы:
<meta name="author" content="Щипунов Андрей">
Документ обновляется каждые 30 секунд:
<meta http-equiv="refresh" content="30">
Пример тега <meta>:
Пример
<meta charset="UTF-8">
<meta name="description" content="Бесплатные веб учебники">
<meta name="keywords" content="HTML,CSS,XML,JavaScript">
<meta name="author" content="Щипунов Андрей">
Попробуйте сами »
Настройка области просмотра
В HTML существует метод, позволяющий веб дизайнерам взять контроль над видовым окном через тег <meta>.
Видовой экран - это видимая область веб страницы пользователя. Он зависит от устройства и будет меньше на мобильном телефоне, чем на экране компьютера.
Вы должны включить следующий элемент <meta> видового экрана на всех ваших веб страницах:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
В <meta> элемент viewport содержит инструкции для браузера о том, как управлять размерами страницы и масштабирование.
Часть width=device-width задает ширину страницы, соответствующую ширине экрана устройства (которая будет варьироваться в зависимости от устройства).
Часть initial-scale=1.0 устанавливает начальный уровень масштабирования при первой загрузке страницы браузером.
Вот пример веб страницы без мета-тега viewport и той же веб страницы с тегом viewport <meta>:
Совет: Если вы просматриваете эту страницу с телефона или планшета, вы можете нажать на две ссылки ниже, чтобы увидеть разницу.
HTML <script>
Элемент <script> используется для определения клиентского Javascript.
JavaScript пишет "Привет JavaScript!" в HTML элемент с помощью id="demo":
Пример
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "Привет JavaScript!";
}
</script>
Попробуйте сами »
Совет: Чтобы узнать все о JavaScript, посетите JavaScript Учебник.
HTML <base>
Элемент <base> задает базовый URL адрес и базовый целевой объект для всех относительных URL адресов на странице:
HTML Главные элементы
| Тег | Описание |
|---|---|
| <head> | Определяет информацию о документе |
| <title> | Определяет заголовок документа |
| <base> | Определяет адрес по умолчанию или цель по умолчанию для всех ссылок на странице |
| <link> | Определяет связь между документом и внешним ресурсом |
| <meta> | Определяет метаданные о документе HTML |
| <script> | Определяет сценарий на стороне клиента |
| <style> | Найдете информацию о стиле документа |
Для получения полного списка всех доступных HTML тегов посетите HTML Справочник тегов.