Нужен CSS a.tag не сотрудничает

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...
}