Как поменять цвет ссылок в меню?

Question

[Владимир Юрченков]

Как поменять цвет ссылок в меню при открытии определенного селектора?

Есть сайт, на котором фиксированное левое меню с ссылками

<div class="menu">
		  <ul>
			<li class="item"><a href="#1">Продажа недвижимости</a></li>
			<li class="item"><a href="#2">Строительство</a></li>
			<li class="item"><a href="#3">Производство</a></li>
			<li class="item"><a href="#4">Проектирование</a></li>
			<li class="item"><a href="#5">Услуги</a></li>
		  </ul>
		</div>

И естественно 5 селекторов, в каждом елементы определенного цвета.

1-розовый
2-голубой
3-красный
4-зеленый
5-оранжевый

Например мы находимся на 1 селекторе(цвета розовые). Мне нужно, чтобы при переходе на следующий т.е 2(голубой), ссылки в меню(цвет при наведении и активная ссылка) меняли свой цвет. Как такое сделать и возможно ли без скриптов?

Answer 1

[Dark Hole]

.item > a[href=#1]:hover {
  color: red;
}

Comments

[Владимир Юрченков]

Товарищи, не внимательно! "Мне нужно, чтобы при переходе на следующий селектор т.е 2(голубой), ссылки в меню(цвет при наведении и активная ссылка) меняли свой цвет. И так далее в 3, значит ссылки будут гореть зеленым."

[dom1n1k]

Владимир Юрченков: Я вот прочел внимательно и 3 раза и все равно не уверен, что понял суть задачи.
Но если я понял правильно, то нет - без скриптов такое невозможно.

[Dark Hole]

dom1n1k: почему нельзя то? :nth-of-child или [href=] + :hover можно

[dom1n1k]

Dark Hole: А, ну значит я таки не понял задания. Я думал, что он хочет менять цвет во всём меню, а не только в одном вложенном.

[Владимир Юрченков]

dom1n1k: Dark Hole: Открыт 1 селектор. В нем меню при наведении и активная ссылка горит розовым. Открываю второй селектор, там при наведении в меню на ссылки и активная ссылка горит голубым и тд.

[Dark Hole]

Владимир Юрченков: я же сказал, как это сделать

[Ankhena]

Dark Hole: Владимир Юрченков
Вы не правильно сказали, red это #3 :)

Вместо селекторов атрибутов можно nth-child

[Dark Hole]

Ankhena W: я знаю. Это пример

Answer 2

[Денис Т]

codepen.io/slow_D/pen/vXRWbw