Атрибут http-equiv тега <meta> — HTTP-заголовок
Атрибут http-equiv (HTML тега <meta>) фактично еквівалентний гіпертекстовому заголовку (імітація http-заголовка), формують заголовок сторінки і визначають його обробку. Як правило, вони керують діями браузерів і використовуються для формування інформації, яка видається звичайними http-заголовками. Назва заголовка вказується в атрибуті http-equiv, а значення вказується в атрибуті content. У деяких випадках можуть автоматично бути переведені в справжні HTTP-заголовки.
Загальний опис
автор: NagarD
- Порада
-
Якщо атрибут
автор: с3сhttp-equivвикористовується, то атрибутnameне повинен встановлюватися в мета-тег.
Синтаксис
<meta http-equiv="<meta http-equiv = "content-security-policy | content-type | default-style | refresh">">
Атрибут http-equiv може отримувати 4 значень:
-
Content-Type -
Тип кодування документа.
автор: с3с -
expires -
Встановлює дату і час, після якої інформація в документі буде вважатися застарілою.
автор: с3с -
pragma -
Спосіб кешування документа.
автор: с3с -
refresh -
Завантажує інший документ в поточне вікно браузера.
автор: с3с
Переглядачі
| Переглядач |  |
 |
 |
 |
 |
 |
|---|---|---|---|---|---|---|
| 1 | 1 | ≤4 | ≤12.1 | 12 | ≤6 |
| Переглядач |  |
 |
 |
 |
|---|---|---|---|---|
| 4.4 | 18 | 4 | ≤3.2 |
Приклади
+ запропонувати свій приклад у пісочниці
Найпростіший приклад використання HTML атрибута http-equiv теґа <meta>
<!DOCTYPE HTML>
<html>
<head>
<title>META</title>
<meta charset="utf-8">
<meta http-equiv="expires" content="Sun, 21 Jan 2019 07:01:00 GMT">
</head>
<body>
</body
</html>Які значення http-equiv браузер виконує, а які мовчки ігнорує
HTML
<div class="poruch">
<div class="karta pratsiuie">
<h3>Браузер виконує</h3>
<ul>
<li><code>content-type</code> <small>— лише кодування; сьогодні пишуть <code><meta charset></code></small></li>
<li><code>content-security-policy</code> <small>— крім <code>frame-ancestors</code>, <code>report-uri</code>, <code>sandbox</code></small></li>
<li><code>refresh</code> <small>— працює, але переадресацію краще робити сервером</small></li>
<li><code>default-style</code> <small>— вибір альтернативного набору стилів</small></li>
</ul>
</div>
<div class="karta ihnoruie">
<h3>Мовчки ігнорує</h3>
<ul>
<li><code>Cache-Control</code></li>
<li><code>Expires</code></li>
<li><code>Pragma</code></li>
<li><code>X-Frame-Options</code></li>
<li><code>Set-Cookie</code></li>
<li><code>Access-Control-Allow-Origin</code></li>
</ul>
<p><small>Усе це задається тільки заголовками сервера.</small></p>
</div>
</div>CSS
.poruch {
display: flex;
flex-wrap: wrap;
gap: 16px;
}
.karta {
flex: 1 1 260px;
border: 1px solid #d0d0d0;
border-radius: 6px;
padding: 10px 14px;
}
.karta h3 {
margin: 0 0 8px;
font-size: 15px;
}
.karta ul {
margin: 0;
padding-left: 18px;
}
.karta li {
margin-bottom: 4px;
}
.karta small {
color: #6b6b6b;
}
.pratsiuie {
border-color: #1b7a3d;
background: #f2fbf5;
}
.ihnoruie {
border-color: #b3261e;
background: #fdf3f2;
}
.ihnoruie code {
text-decoration: line-through;
}Різниця між HTML 4.01 та HTML5
У HTML 5 значення content-type вважається застарілим.
Коментарі
Коментарів ще немає — будьте першим!