Атрибут profile тега <head> — адреса профілю метаданих
автор: с3с
Загальний опис
автор: NagarD
Синтаксис
<head profile="URL">
Атрибут profile може отримувати єдине значення:
-
URL -
Адреса профіля.
автор: с3с
Переглядачі
| Переглядач | ||||||
|---|---|---|---|---|---|---|
| 1 | 3 | 2 | 7 | 12+ | 6 |
| Переглядач | ||||
|---|---|---|---|---|
| 1+ | 1+ | 3+ | 2+ |
Приклади
+ запропонувати свій приклад у пісочниці
<!DOCTYPE html>
<html>
<head profile="http://gmpg.org/xfn/11">
<title>Приклад використання атрибуту profile тегу head <head></title>
</head>
<body>
<p>Приклад використання атрибуту profile тегу head</p>
<p><a href="https://example.com/xfn-profile" rel="profile">
Head profile
</a></p>
Приклад написано повним документом, бо інакше <head> не показати. Стилі примусово вмикають показ шапки й дописують до неї вміст атрибута — у справжній сторінці цього рядка не видно ніде. Нижче — те, заради чого профіль колись і писали: посилання зі значеннями rel, які сьогодні розуміють без жодного словника. Значення кожного дописано до посилання стилями.
HTML
<!doctype html>
<html lang="uk">
<head profile="http://gmpg.org/xfn/11 http://microformats.org/profile/hcard">
<meta charset="utf-8">
<title>Профіль метаданих</title>
</head>
<body>
<p class="head">Так виглядає head цього самого документа</p>
<p class="note">Червона рамка на самому верху — це справжній head цієї сторінки:
він стоїть у розмітці перед тілом, тому й малюється першим. Показати його
вдалося лише примусово, стилями. У живій сторінці з нього не видно нічого,
і атрибут profile жоден переглядач не завантажує.</p>
<p class="head">Значення rel працюють без жодного профілю</p>
<ul class="posylannia">
<li><a href="https://example.com/ya" rel="me">мій профіль в іншій мережі</a></li>
<li><a href="https://example.com/avtor" rel="author">сторінка автора</a></li>
<li><a href="https://example.com/licenziia" rel="license">умови використання</a></li>
<li><a href="https://example.com/partner" rel="nofollow sponsored">рекламне посилання</a></li>
<li><a href="https://example.com/zvychaine">звичайне посилання без rel</a></li>
</ul>
</body>
</html>
CSS
body {
margin: 12px;
background: #ffffff;
color: #111111;
font: 16px/1.5 system-ui, sans-serif;
}
head {
display: block;
max-width: 620px;
margin: 0 0 10px;
padding: 8px 10px;
border: 2px dashed #d64545;
border-radius: 6px;
background: #fff4f4;
color: #c0392b;
font: 14px/1.6 ui-monospace, monospace;
}
head::before {
content: "<head profile=…> ";
color: #5a6472;
}
head::after {
content: attr(profile);
}
title,
meta,
style {
display: none;
}
.head {
margin: 20px 0 6px;
color: #5a6472;
font: 600 14px/1.4 system-ui, sans-serif;
text-transform: uppercase;
letter-spacing: .04em;
}
.note {
max-width: 620px;
margin: 0 0 10px;
color: #5a6472;
font-size: .9em;
}
.posylannia {
max-width: 620px;
margin: 0;
padding: 10px 10px 10px 28px;
border: 1px solid #b9c6d8;
border-radius: 6px;
background: #f6f9ff;
line-height: 2.1;
}
a[rel]::after {
content: " rel=" attr(rel);
padding: 1px 5px;
border-radius: 3px;
background: #eef3fb;
color: #1b4f9c;
font: 13px/1.6 ui-monospace, monospace;
text-decoration: none;
}
a:not([rel])::after {
content: " без rel";
color: #5a6472;
font-size: .85em;
text-decoration: none;
}
Різниця між HTML 4.01 та HTML5
Атрибут profile тега <head> більше не підртимується в HTML5.
Коментарі
Коментарів ще немає — будьте першим!