Question

这个网站变得一团糟。我似乎无法让左侧导航看起来像我想要的那样。

我认为这很简单，但我看不到它。

这是CSS：

a.col1:link {color:#FFF}      /* unvisited link */
a.col1:visited {color:#00F}  /* visited link */
a.col1:hover {color:#FF0}  /* mouse over link */
a.col1:active {color:#00F}  /* selected link */

这是html：

<ul class="col1"><li><a href="see_autos.asp>car</a></li></ul>

Answer 1

首先，你需要一个"来结束你的href。

其次，你的班级不在你的a上，而是在家长上，所以你的css应该是

.col1 a:link {color:#FFF}

第三，请不要将其命名为col1，语义名称更好left-nav或sidebar更好。

Answer 2

您需要将CSS伪类的样式直接应用于A标记本身。如您所示，它们是您结构中UL LI标签的后代，因此您可以选择它们。

ul.col1 li a:link {color:#FFF}      /* unvisited link */
ul.col1 li a:visited {color:#00F}  /* visited link */
ul.col1 li a:hover {color:#FF0}  /* mouse over link */
ul.col1 li a:active {color:#00F}  /* selected link */

Answer 3

您的CSS希望col1成为<a>元素的一个类。但是您已将其分配给<ul>元素。因此，要解决此问题，您需要更改HTML，如下所示

<ul><li><a href="see_autos.asp" class="col1">car</a></li></ul>

以便将其分配给正确的元素，或以更改CSS，如下所示

ul.col1 a:link {color:#FFF}      /* unvisited link */
ul.col1 a:visited {color:#00F}  /* visited link */
ul.col1 a:hover {color:#FF0}  /* mouse over link */
ul.col1 a:active {color:#00F}  /* selected link */

以便将其分配给<a>元素的任何子<ul class="col1">元素。

Answer 4

由于锚点是无序列表的子节点，因此你的css应该指定无序列表的子锚点：

.col1 a:link
{
    color...
}

需要CSS a.tag不合作

4 个答案: