麻烦看下有没有问题和需要改进的地方，谢谢
来源：2-6 编程练习
扶耳摩兔
2021-01-06 14:45:18
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style type="text/css">
h3{
color: green;
}
a{
text-decoration: none;
}
div{
border-bottom: 1px solid rgb(112, 108, 108);
}
h3 p a{
color: #009;
}
div p span:nth-of-type(1){
color: orange;
}
</style>
</head>
<body>
<div>
<h3>大话西游之大圣娶亲的影评</h3>
<p><a href="#">热门</a>/<a href="#">最新</a>/<a href="#">好友</a></p>
</div>
<div>
<p>
<a href="">罗弘霉素</a>
<span>★★★★★</span>
<span>2010-07-26</span>
</p>
<p>有人跟我比赛背台词么</p>
<p>阅读：1615
<a href="">有用</a>
</p>
</div>
<div>
<p>
<a href="">十七只猫和鱼</a>
<span>★★★★</span>
<span>2006-04-26</span>
</p>
<p>任何时候任何场合都可以再看一遍的电影</p>
<p>阅读：515
<a href="">有用</a>
</p>
</div>
<div>
<p>
<a href="">暖家男</a>
<span>★★★★</span>
<span>2006-04-22</span>
</p>
<p>一定有一些电影 永远都不能被超越</p>
<p>阅读：490
<a href="">有用</a>
</p>
</div>
</body>
</html>
写回答
1回答
-
同学你好，问题解答如下：
1、html代码结构中h3和p标签是同级的，这里使用了后代选择器是选择不到元素的。h3 p a这种写法属于后代选择器，而html代码结构中h3和p标签是同级的，所以这样写无法选择到元素a，如下图所示：
建议修改：将p换成div，通过div元素找到它的后代元素p，然后再找到p的后代元素a，给它设置样式。
另外，代码可以优化一下，将设置a元素样式的代码写在一起，简化代码书写
2、由于被访问过的链接会记录在浏览器缓存中，而a标签被访问过后浏览器有默认的样式，所以浏览器的缓存可能会影响测试效果，建议同学修改完代码之后，清除浏览器缓存后再测试
祝学习愉快！
0
相似问题
请老师检查一下代码需要改进的地方
回答 2