:hover работает, но остальные состояния ссылки не работают (например, :link и :visited)

По неизвестной мне причине для div с "TWO" внутри:

:hover состояние работает нормально :link, :visited не работает

не могу найти почему?

.menu:link {
  color: teal;
}

.menu:visited {
  color: red;
}

.menu:hover {
  color: yellow;
}

<div>
  <a>
    <div class = "menu">ONE</div>
  </a>
  <a href = "smth.html">
    <div class = "menu">TWO</div>
  </a>
</div>

html css

31.05.2019 07:43

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Введение в CSS

CSS является неотъемлемой частью трех основных составляющих front-end веб-разработки.

Как выровнять Div по центру?

Чтобы выровнять элемент <div>по горизонтали и вертикали с помощью CSS, можно использовать комбинацию свойств и значений CSS. Вот несколько методов,...

Навигация по приложениям React: Исчерпывающее руководство по React Router

React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

Toor - Ангулярный шаблон для бронирования путешествий

Toor - Travel Booking Angular Template один из лучших Travel & Tour booking template in the world. 30+ валидированных HTML5 страниц, которые помогут...

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Селекторы :visited и :link используются с тегом <a>.

a:visited > .menu{
  color: red;
}
a:link > .menu {
  color: teal;
}
a:hover > .menu {
  color: yellow;
}

<div>
  <a>
    <span class = "menu">ONE</span>
  </a>
  <a href = "https://stackoverflow.com" target = "_blank">
    <span class = "menu">TWO</span>
  </a>
</div>

кстати, я не думаю, что это хорошая идея, использовать div внутри a

СПАСИБО! мне нужно, чтобы поле div было самой ссылкой, поэтому я обернул его так. Хотя может быть и лучший способ... Самое смешное, что состояние наведения все еще работало без тега <a>

— 31.05.2019 22:53

пс. каким будет правильный код для работы класса :active сейчас? a:active > .menu{} и добавить class = "active" в html?

— 31.05.2019 23:25

31.05.2019 07:49