请问点击一个链接后,其他链接都显示为访问后的颜色是为什么?
来源:3-23 编程练习
等吃糖葫芦的阿狸
2019-08-20 21:49:46
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>伪类选择器</title>
<style type="text/css">
p{height:30px;}
a{text-decoration:none;}
/*补充代码*/
a:link{color:orange;}
p.suit a:visited{color:green;}
a:hover{color:green; border:1px solid red;}
p.wc a:visited{color:blue;}
p.skin a:visited{color:purple;}
</style>
</head>
<body>
<h2>商品列表</h2>
<p class="suit">
<a href="#">衣服鞋帽</a>
</p>
<p class="wc">
<a href="#">厕所清洁</a>
</p>
<p class="skin">
<a href="#">化妆用品</a>
</p>
</body>
</html>
3回答
要开心鸭
2019-08-21
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>伪类选择器</title>
<style type="text/css">
p{height:30px;}
/*补充代码*/
a{
text-decoration: none;
}
a:link{color: orange;}
a:hover{
color: green;
font-size: 20px;
border: 1px solid red;
}
p.suit a:visited{color: green;}
p.wc a:visited{color: blue;}
p.skin a:visited{color: purple;}
</style>
</head>
<body>
<h2>商品列表</h2>
<p class="suit">
<a href="#">衣服鞋帽</a>
</p>
<p class="wc">
<a href="#">厕所清洁</a>
</p>
<p class="skin">
<a href="#">化妆用品</a>
</p>
</body>
</html>
好帮手慕夭夭
2019-08-21
你好同学,因为访问过的链接是会保存在浏览器缓存中的,如下三个链接设置的href是一样的,所以点击其中一个,其他的也会跟着变成访问状态。可以参考下面的同学,给href设置不同的链接试一下就行。(注意测试时清除浏览器缓存)。
祝学习愉快,望采纳。
琴奏浮世
2019-08-21
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style type="text/css">
p{height:30px;}
a{text-decoration:none;}
/*去除下划线代码*/
.aa.bb.cc:link{color:orange;}
/*当未被访问时字体颜色为橘色*/
.suit a:visited{color:green;}
.wc a:visited{color:blue;}
.skin a:visited{color:purple;}
/*被访问时状态*/
a:hover{font-size: 30px;border:1px solid red;color:green;font-weight: bold;}
/*鼠标悬停时为绿色,字体20px,一个像素的红色边框*/
#cc #aa #bb a:active{color:pink;}
</style>
</head>
<body>
<h2>商品列表</h2>
<p class="suit">
<a href="http://cc.com" id="cc">衣服鞋帽</a>
</p>
<p class="wc">
<a href="#" id="aa">厕所清洁</a>
</p>
<p class="skin">
<a href="#" id="bb">化妆用品</a>
</p>
</body>
</html>
相似问题