Question

我有以下HTML代码：

<ul class="smenu">
<li class="smenuitem"><a href="http://ux.stackexchange.com/"></a></li>
<li class="smenuitem"><a href="http://area51.stackexchange.com/"></a></li>
<li class="smenuitem"><a href="http://www.webmasters.stackexchange.com/"></a></li>
</ul>

我正在尝试将链接看起来像宽度为25px且高度为25px的圆形圆圈，因此我应用了以下css：

li.smenuitem a, li.smenuitem a:link:hover, li.smenuitem a:visited, li.smenuitem a:visited:hover, {
display: block;
width: 25px;
height: 25px;
border-radius: 25px;
background-color: #0000ff;
}

然而，这些链接根本没有出现。它们不是25px乘25px，而且它们没有圆角（它们不是圆形）。谁能告诉我我做错了什么？

Answer 1

您的逗号错位（请参阅选择器列表的最后一部分）：

li.smenuitem a, li.smenuitem a:link:hover, li.smenuitem a:visited, li.smenuitem a:visited:hover, {

对战：

li.smenuitem a, li.smenuitem a:link:hover, li.smenuitem a:visited, li.smenuitem a:visited:hover {
    display: block;
    width: 25px;
    height: 25px;
    border-radius: 25px;
    background-color: #0000ff;
}

http://jsfiddle.net/J2XTs/

Answer 2

在a：visited：hover之后删除选择器中的最后一个逗号，我认为那是什么东西匆匆忙忙

使用CSS将链接转换为小圆圈

2 个答案: