CSS :visited — стиль відвіданого посилання
CSS-селектор :visited обирає посилання, за якими користувач уже переходив.
Загальний опис
автор: NagarD
- Порада
-
Використовуйте селектор
автор: NagarD:linkдля посилань на невідвідувані сторінки, селектор:hoverдля задання стилю посиланням на яких наведено курсор, а селектор:activeдля стилізації посилань при натисненні на них.
Синтаксис
:visited {
css declarations;
}Переглядачі
| Переглядач |  |
 |
 |
 |
 |
 |
|---|---|---|---|---|---|---|
| 1 | 1 | 1 | 3.5 | 12 | 4 |
| Переглядач |  |
 |
 |
 |
|---|---|---|---|---|
| 4.4 | 18 | 4 | 1 |
Приклади
+ запропонувати свій приклад у пісочниці
Відвідане посилання іншого кольору; спроба змінити жирність у :visited браузер проігнорує — це не помилка прикладу.
HTML
<p><a class="nav" href="https://css.in.ua">Це посилання ви, найпевніше, вже відвідували</a></p>
<p><a class="nav" href="https://example.com/невідвідане-посилання">А це — навряд чи</a></p>CSS
body { font: 16px/1.8 system-ui, sans-serif; }
.nav:link {
color: #2563eb;
}
.nav:visited {
color: #9333ea;
/* усе, крім кольорів, тут ігнорується — навмисно */
font-weight: 700;
}Відвідані посилання стають рожевими. З міркувань приватності для :visited дозволено міняти лише кольори — інші властивості браузер проігнорує.
HTML
<p><a href="/css/properties">Це посилання стане рожевим після відвідин</a> — відкрий його і повернися.</p>CSS
a:visited {
color: pink;
}Коментарі
Коментарів ще немає — будьте першим!