Home >Web Front-end >HTML Tutorial >Why is a:visited invalid? _html/css_WEB-ITnose
Why is a:visited invalid? _html/css_WEB-ITnose
- WBOYOriginal
- 2016-06-24 12:17:361486browse
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title></title><meta http-equiv="Content-Type" content="text/html;charset=utf-8"><style type="text/css">.link a:link{ color:blue;}.link a:visited{ color:yellow;}.link a:hover{ color:red;}.link a:active{ color:#ccc;}</style></head><body><div id="webmanage"> <ul> <li class="link"><a href="__ROOT__category" target="dashbord">栏目一</a></li> <li class="link"><a href="__ROOT__article/lists" target="dashbord">栏目二</a></li> <li class="link"><a href="__ROOT__article/add" target="dashbord">栏目三</a></li> <li class="link"><a href="__ROOT__member/reg" target="dashbord">栏目四</a></li> </ul></div> </body></html> Why can't this code be implemented: when the mouse is not clicked, it is blue, when it is clicked, it is yellow, then click the second one, the second one is yellow, and the previous one returns to blue? ? ?
I found that the main problem is 1.visited. Is there a problem here? 2. When you open this page, aren’t they all blue?
Reply to discussion (solution)
.link a:link{ color:blue;}a:visited{ color:yellow;}a:hover{ color:red;}a:active{ color:#ccc;} Remove the previous .link
Also remove the first one , typo.
You separate this attribute a into different classes, and then set its attributes. For example:
25edfb22a4f469ecb59f1190150159c65643b679b965ad781916921c5c4868505db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c694305d107bba0893e4b582754a1c85d75db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c6082c059b66ec6df7687d01d88cfd77a05db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
25edfb22a4f469ecb59f1190150159c658ee1332ef271b25ed02ece090c963445db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb
css:
.a a:link{}
.b a:link{}
.c a:link{}
.d a:link{}
You should get the effect you want