HTML a, a:hover 工作，但 a:selected 不是
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/18563177/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
HTML a, a:hover working, but a:selected is not
提问by Sterling
Hi I have some HTML and CSS that creates a <ul>on my screen. The items are links to other pages on the site. I want the items in the list to be black normally, light grey if hovered over, and light grey if it's the screen the user is on.
嗨，我有一些 HTML 和 CSS 可以<ul>在我的屏幕上创建一个。这些项目是指向站点上其他页面的链接。我希望列表中的项目通常是黑色的，如果悬停在上面，则为浅灰色，如果是用户所在的屏幕，则为浅灰色。
Here is the HTML for the <ul>on the home screen. On the home screen, the list item "Home" should be light grey, while all the others should be black unless hovered over.
这是<ul>主屏幕上的 HTML 。在主屏幕上，列表项“主页”应为浅灰色，而所有其他项应为黑色，除非将鼠标悬停在其上方。
<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>
My CSS sheet is:
我的 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;
}
The links are black, which is good. They also turn light grey when I hover over them, which is great. But whenever I select one of the items to go to the page, I can't get the link that I'm currently on to be light grey. This also applies to the home page - whenever I go to the first page, the "Home" item is in black.
链接是黑色的，很好。当我将鼠标悬停在它们上方时，它们也会变成浅灰色，这很棒。但是，每当我选择其中一项进入该页面时，我都无法将当前所在的链接设为浅灰色。这也适用于主页 - 每当我转到第一页时，“主页”项都是黑色的。
Can anyone see what I'm doing wrong here? Any help is appreciated.
谁能看到我在这里做错了什么？任何帮助表示赞赏。
回答by Marc Audet
Do you mean to do this:
你的意思是要这样做：
#navmenu ul li a.selected {
color:#F2F2F2;
}
See: http://jsfiddle.net/audetwebdesign/nSgDf/
见：http: //jsfiddle.net/audetwebdesign/nSgDf/
There is currently no :selectedpseudo-class in CSS2 or CSS3.
目前:selected在 CSS2 或 CSS3 中没有伪类。
Apply the .selectedclass to denote the current page that the user is visiting.
应用.selected该类来表示用户正在访问的当前页面。
Reference: http://www.w3.org/TR/css3-selectors/#pseudo-classes
