HTML - тег <meta>
Пример
Опишите метаданные в документе HTML:
<head>
<meta charset="UTF-8">
<meta name="description" content="Free Web tutorials">
<meta name="keywords" content="HTML, CSS, JavaScript">
<meta name="author" content="John Doe">
<meta
name="viewport" content="width=device-width, initial-scale=1.0">
</head>
Другие примеры «Попробуйте сами» ниже.
Определение и использование
Тег <meta>определяет метаданные о HTML-документе. Метаданные — это данные (информация) о данных.
<meta> теги всегда находятся внутри элемента <head> и обычно используются для указания набора символов, описания страницы, ключевых слов, автора документа и настроек области просмотра.
Метаданные не будут отображаться на странице, но могут быть обработаны машиной.
Метаданные используются браузерами (как отображать контент или перезагружать страницу), поисковыми системами (ключевые слова) и другими веб-сервисами.
Существует метод, позволяющий веб-дизайнерам управлять областью просмотра (видимой пользователем областью веб-страницы) с помощью <meta>тега (см. Пример «Настройка области просмотра» ниже).
Поддержка браузера
| Element | |||||
|---|---|---|---|---|---|
| <meta> | Yes | Yes | Yes | Yes | Yes |
Атрибуты
| Attribute | Value | Description |
|---|---|---|
| charset | character_set | Specifies the character encoding for the HTML document |
| content | text | Specifies the value associated with the http-equiv or name attribute |
| http-equiv | content-security-policy content-type default-style refresh |
Provides an HTTP header for the information/value of the content attribute |
| name | application-name author description generator keywords viewport |
Specifies a name for the metadata |
Глобальные атрибуты
Тег <meta>также поддерживает глобальные атрибуты в HTML .
Дополнительные примеры
Определите ключевые слова для поисковых систем:
<meta name="keywords" content="HTML, CSS, JavaScript">
Определите описание вашей веб-страницы:
<meta name="description" content="Free Web tutorials for
HTML and CSS">
Определить автора страницы:
<meta name="author" content="John Doe">
Обновлять документ каждые 30 секунд:
<meta http-equiv="refresh" content="30">
Настройка области просмотра, чтобы ваш сайт хорошо отображался на всех устройствах:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
Настройка области просмотра
Область просмотра — это видимая пользователем область веб-страницы. Оно зависит от устройства — на мобильном телефоне оно будет меньше, чем на экране компьютера.
Вы должны включить следующий <meta>элемент на все свои веб-страницы:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
Это дает браузеру инструкции о том, как управлять размерами и масштабированием страницы.
Эта width=device-widthчасть устанавливает ширину страницы в соответствии с шириной экрана устройства (которая будет варьироваться в зависимости от устройства).
Эта initial-scale=1.0часть устанавливает начальный уровень масштабирования при первой загрузке страницы браузером.
Вот пример веб-страницы без метатега области просмотра и той же веб-страницы с метатегом области просмотра:
Совет: Если вы просматриваете эту страницу с телефона или планшета, вы можете нажать на две ссылки ниже, чтобы увидеть разницу.
Вы можете прочитать больше об области просмотра в нашем адаптивном веб-дизайне — Учебник по области просмотра .
Связанные страницы
Учебник по HTML: заголовок HTML
Справочник по HTML DOM: метаобъект
Настройки CSS по умолчанию
Никто.