← Все статьи

Туториалы

Подсвети посещённые ссылки — и почему CSS позволяет так мало

15 мая 2026 · автор JustZix Team

Результаты поиска, список статей, документация — и никакого способа понять, какие ссылки ты уже открывал. Одно CSS-правило это решает. И по пути стоит узнать, почему селектор :visited так странно урезан.

Правило

На вкладке CSS правила, URL-паттерн для страницы со списками ссылок или * глобально:

a:visited {
  color: #9333ea !important;
}

Вот и всё. Посещённые ссылки становятся фиолетовыми. Выбери цвет, сильно отличающийся от цвета обычной ссылки, чтобы контраст читался мгновенно.

Почему можно так мало

Естественный инстинкт: раз я могу менять цвет, добавлю ещё иконку или фон. Не сделаешь — и это намеренно.

Если бы :visited позволял произвольные стили, любая страница могла бы определить твою историю. Она вставила бы тысячу скрытых ссылок, дала бы каждой разный размер или фон через :visited, измерила бы layout с помощью JavaScript и прочитала бы, какие URL ты посетил. Это была реальная уязвимость (history sniffing) — и браузеры её закрыли.

Что разрешено, что нет

На :visited работают только свойства цвета: color, background-color, border-color, outline-color. И даже эти «привираются» в одну сторону:

• Никаких свойств layout. display, font-size, content, visibility — игнорируются на :visited. Вот почему a:visited::after { content: " ✓" } не сработает.
• getComputedStyle врёт. При запросе о цвете посещённой ссылки он возвращает непосещённый цвет — так JavaScript не может прочитать правду.
• Фон и рамка должны быть видимы заранее. Ты можешь менять цвет фона, но не можешь «включить» его из ничего измеримым образом.

Хочешь больше, чем цвет?

Бейджи, иконки, счётчики визитов — :visited тебе их не даст. Они требовали бы трекинга твоей истории в JavaScript, что отдельная и куда более тяжёлая тема. Для большинства случаев одного цвета хватает с избытком — потому что единственное, что тебе реально нужно, это «был я здесь или нет».

Ловушки

• Совпадение по точному URL. :visited работает, если ты посетил ровно этот адрес. Ссылка на /статью не подсветится, если ты был на /статью?ref=x.
• SPA и ссылки. В single-page приложении «навигация» может быть сменой состояния без реальной навигации — браузер тогда не записывает запись истории, и :visited не применяется.
• Контраст. Фиолетовый на белом фоне читаем; на тёмной теме выбери более светлый оттенок.

Смотри также

• Примеры — этот сниппет и другой готовый CSS
• Тёмная тема для любого сайта — ещё одно CSS-правило, ориентированное на комфорт
• Скрытие cookie-баннеров — прореживание страницы на основе CSS

Установи JustZix — и понимай с одного взгляда, где ты уже был.