2 
nav ul {
}

nav ul li {
    margin-left: 7px;
}

nav.ul li a, a:link, a:visited {
    float: left;
    padding: 7px;
    margin-left: 15px;
    color: #ffffff;
    text-decoration: none;
    font-weight: bold;
}

nav ul li a:hover {
}

我只希望上面的代码对<nav></nav>

然而，现在它也可以为<a href="">导航元素的外部设置样式。我怎样才能确保它做我想要的？

4

5 回答 5

5

您拥有的规则仅适用于nav元素，但以下情况除外：

nav.ul li a, a:link, a:visited {

此规则适用于a:link和a:visited。你要这个：

nav.ul li a, nav.ul li a:link, nav.ul li a:visited {
于 2012-07-09T01:32:30.277 回答
3

这是因为这一行不正确：

nav.ul li a, a:link, a:visited {

它应该是：

nav ul li a, nav ul li a:link, nav ul li a:visited {

在逗号 (,) 之后，CSS 将应用于所有a标签，因为没有指定前面的选择器。此外，您nav ul在第一部分中有一个句点 (.)。

于 2012-07-09T01:32:49.630 回答
1

改变你的规则：

nav.ul li a, a:link, a:visited

到：

nav.ul li a, nav.ul li a:link, nav.ul li a:visited

通过省略逗号分隔之间的 nav.ul li 部分，您可以有效地应用于 nav.ul li 之外的链接。

于 2012-07-09T01:32:01.260 回答
1

您的代码针对 a:link 和 a:visited 而不使用后代选择器。使用以下内容应该可以解决您的问题：

nav ul li a, nav ul li a:link, nav ul li a:visited {
    float: left;
    padding: 7px;
    margin-left: 15px;
    color: #ffffff;
    text-decoration: none;
    font-weight: bold;
}
于 2012-07-09T01:32:33.960 回答
0

确保所有选择器都以nav ul li.

nav ul li a, nav ul li a:link, nav ul li a:visited {
    float: left;
    padding: 7px;
    margin-left: 15px;
    color: #ffffff;
    text-decoration: none;
    font-weight: bold;
}
于 2012-07-09T01:31:40.513 回答