Атрибут alink тега <body> — колір активного посилання
Атрибут alink визначає колір активного посилання в документі (посилання активується при натисканні або виділенні клавіатурою).
Загальний опис
автор: NagarD
Синтаксис
<body alink="color_name|hex_number|rgb_number">
Атрибут alink може отримувати 3 значень:
-
color_name -
Визначає колір посилання за назвою кольору (наприклад, "red").
автор: с3с -
hex_number -
Визначає колір посилання за НЕХ кодом (наприклад, "#ff0000").
автор: с3с -
rgb_number -
Визначає колір посилання за RGB кодом (наприклад, "RGB (255.0.0)").
автор: с3с
Переглядачі
| Переглядач | ||||||
|---|---|---|---|---|---|---|
| 1 | 1 | ≤4 | 15 | 12 | ≤11 |
| Переглядач | ||||
|---|---|---|---|---|
| 4.4 | 18 | 4 | ≤3.2 |
Приклади
+ запропонувати свій приклад у пісочниці
Найпростіший приклад використання HTML атрибута alink теґа <body>
<body alink="black">
<p>Приклад використання атрибуту alink</p>
<a href="#1">Посилання на документ1</a><br /><br />
<a href="#2">Посилання на документ2</a><br /><br />
<a href="#3">Посилання на документ3</a>
Найпростіший приклад використання HTML атрибута alink теґа <body>
<body id="b" onload="func(this.vling)">
<p>Приклад використання атрибуту alink</p>
<a href="#1">Посилання на документ1</a><br /><br />
<a href="#2">Посилання на документ2</a><br /><br />
<a href="#3">Посилання на документ3</a><br><br>
<input type="color" name="" id="a1"><br><br>
<input type="button" onclick="func()" value="Змінити колір">
Ліворуч посилання пофарбовані САМЕ атрибутами link, vlink і alink у теґу <body> — жодного правила CSS на них немає; натисніть і потримайте мишу, щоб побачити активний колір. Праворуч те саме зроблено псевдокласами, причому нижній блок навмисно записаний у хибному порядку: :active стоїть перед :hover, і активний колір там не з'явиться ніколи.
HTML
<!doctype html>
<html lang="uk">
<head><meta charset="utf-8"><title>alink</title></head>
<body alink="#ff0000" link="#00a000" vlink="#8a2be2">
<div class="cols">
<section>
<h3>Тільки атрибути body</h3>
<p><a href="#a1">Натисніть і потримайте — стане червоним</a></p>
<p><a href="#a2">Друге посилання, той самий набір кольорів</a></p>
<p class="why">Цих посилань не торкається жодне правило CSS: зелений,
фіолетовий і червоний беруться з атрибутів link, vlink і alink.</p>
</section>
<section>
<h3>Правильний порядок: LVHA</h3>
<p><a class="lvha" href="#a3">Наведіть, потім натисніть і потримайте</a></p>
<p class="why">Синє — звичайне, помаранчеве — під курсором, червоне —
під натиснутою мишею. Усе видно, бо :active записаний останнім.</p>
<h3>Хибний порядок: :active перед :hover</h3>
<p><a class="wrong" href="#a4">Натисніть — червоного не буде</a></p>
<p class="why">Правило :active тут програє: у нього така сама вага, а
записане воно раніше, тож перемагає :hover.</p>
</section>
</div>
</body>
</html>
CSS
body {
font: 16px/1.6 system-ui, sans-serif;
margin: 12px;
background: #fff;
color: #111;
}
.cols {
display: flex;
flex-wrap: wrap;
gap: 24px;
}
section {
flex: 1 1 260px;
min-width: 260px;
padding: 10px 14px;
border: 2px solid #b9c6d8;
border-radius: 6px;
}
h3 {
margin: 10px 0 6px;
font-size: 1em;
color: #1b4f9c;
}
a.lvha:link {
color: #1b4f9c;
}
a.lvha:visited {
color: #8a2be2;
}
a.lvha:hover {
color: #e07b00;
}
a.lvha:active {
color: #ff0000;
}
a.wrong:link {
color: #1b4f9c;
}
a.wrong:visited {
color: #8a2be2;
}
a.wrong:active {
color: #ff0000;
}
a.wrong:hover {
color: #e07b00;
}
.why {
margin: 6px 0 0;
color: #5a6472;
font-size: .9em;
}
Різниця між HTML 4.01 та HTML5
Атрибут alink для тега <body> не підтримується у HTML5. Користуйтесь для цього CSS.
Коментарі
Коментарів ще немає — будьте першим!