列出导航栏问题（颜色、功能）答案

【问题标题】：List Navbar Problems (Color, Functionality)列出导航栏问题（颜色、功能）
【发布时间】：2013-05-25 09:12:32
【问题描述】：

我使用无序列表创建了一个导航栏。这是我的问题：

我无法更改列表项文本的颜色，并且由于某种原因我无法再单击我的链接（我之前在开发中能够单击它们，不知道它们何时停止工作）。

这些物品现在的样子：

http://gyazo.com/c089ed3f21368d4d2a1d91a52e129222.png

HTML：

<div class="grid_16 alpha" id="header">
    <ul id="nav" class="grid_4 prefix_1">
        <li id="nav_home"><a href="#">Home</a></li>
        <li id="nav_home"><a href="#">News</a></li>             
    </ul>
</div>

CSS：

#nav {
    color:white;
    margin-top: 54px;
}

#nav li {
    color: white;
    display: inline;        
}

#nav a:link {
    font-family: ColaborateThinRegular; 
    font-size: 18px;
    text-decoration: none;
    background-color: #353535;
    padding: 5px 20px;
    margin-right: 15px; 
    color: white;
    box-shadow: 1px 1px 3px #000;   
}

【问题讨论】：

你能附上jsFiddle吗？
也不要将两个元素的 id 设置为相同。 ID 必须是唯一的。而是使用一个类。

标签： html css hyperlink navigation

【解决方案1】：

找到了：

看看这个jsFiddle。出现着色问题是因为您没有指定a:visited 和a:link，所以颜色是紫色。

不可点击的问题.. 与href="#" 或您网站上阻止它的其他代码有关.. 我已将 jsFiddle 中的一个按钮链接到谷歌，它在第一次点击后继续工作。试试看

【讨论】：

【解决方案2】：

访问链接后，您的样式将停止工作。尝试实现这个： #nav a:visited {color: white;} 永远记住 id 是唯一的。

【讨论】：