HTML a, a: hover working, но a: selected is not

Question

Привет У меня есть HTML и CSS, который создает на моем экране <ul>. Элементы являются ссылками на другие страницы сайта. Я хочу, чтобы элементы в списке были черными нормально, светло-серые, если они зависали, и светло-серый, если это экран, на котором пользователь включен.

Вот HTML для <ul> на главном экране. На главном экране элемент списка «Главная» должен быть светло-серым, а все остальные должны быть черными, если не зависнуть.

<div id="navmenu"> 
    <ul> 
     <li><a class="selected" href="index.html">Home</a></li> 
     <li><a href="research.html">Research</a></li> 
     <li><a href="cv.html">CV</a></li> 
     <li><a href="links.html">Links</a></li> 
    </ul> 
</div> 

Мой CSS лист:

#navmenu { 
    margin: auto; 
} 

#navmenu ul { 
    text-align:center; 
} 


#navmenu ul li { 
    display:inline; 
    padding-left:25px; 
    padding-right:25px; 
} 


#navmenu ul li a { 
    color:#000000; 
} 

#navmenu ul li a:hover { 
    color:#F2F2F2; 
} 

#navmenu ul li a:selected { 
    color:#F2F2F2; 
} 

Связи черные, это хорошо. Они также становятся светло-серыми, когда я навис над ними, что здорово. Но всякий раз, когда я выбираю один из элементов для перехода на страницу, я не могу получить ссылку, которую я сейчас нахожу, светло-серый. Это также относится к домашней странице - всякий раз, когда я перехожу на первую страницу, элемент «Главная» находится в черном цвете.

Может ли кто-нибудь увидеть, что я делаю неправильно здесь? Любая помощь приветствуется.

Answer 1

ли вы имеете в виду, чтобы сделать это:

#navmenu ul li a.selected { 
    color:#F2F2F2; 
} 

См: http://jsfiddle.net/audetwebdesign/nSgDf/

Там в настоящее время нет :selected псевдо-класса в CSS2 или CSS3.

Применить класс .selected, чтобы обозначить текущую страницу, которую посещает пользователь.

Ссылка: http://www.w3.org/TR/css3-selectors/#pseudo-classes