Css стайлинг ссылка внутри таблицы (табличные данные) не будет работать

Question

У меня есть сайт, сделанные из таблицы для его расположения, но ссылки не могут быть стилизованы правильно

Моего стола кода навигационной панель

<table id="table"> 
<tr class="navbar"> 
<td><a href="#">HOME</a></td> 
<td><a href="#">MY PROFILE</a></td> 
<td><a href="#">MY WORKS</a></td> 
<td><a href="#">ABOUT SITE</a></td> 
</tr> 
</table> 

Мой CSS код

a.navbar:link { 
    color:whitesmoke; 

} 

a.navbar:visited { 
    color:red; 

} 

a.navbar:hover { 
    color:red; 
    background-color: yellow; 

} 

a.navbar:active { 
    color:red; 

} 

Answer 1

Ваш CSS селекторы не являются правильными, поскольку ссылки не имеют класс navbar.

Правильное решение было бы выбрать элемент типа a внутри элемента класса navbar как это:

.navbar a:link { 
    color:whitesmoke; 
} 

.navbar a:visited { 
    color:red; 
} 

.navbar a:hover { 
    color:red; 
    background-color: yellow; 
} 

.navbar a:active { 
    color:red; 
} 

Почему это использование HTML таблицы в целом не может быть лучшим вариантом можно обширно discussed on SO.

Answer 2

переключатель вокруг:

.navbar a { *styles* } 

Answer 3

a.navbar выбирает a е lements, которые имеют класс navbar. В этом случае вы должны использовать .navbar a {}.

Я бы не стал использовать таблицы в качестве меню. Я рекомендую использовать ul s, так как они могут быть более сложными.

Answer 4

попробовать

.navbar > td > a:link {...} 

и т.д.