页面a 标签 color 问题？

问题描述： 写页面的时候都会默认重置 a标签

a{ color: blue; } a:hover{ color: red; background:yellow; }

然而问题就来了 页面上的 a标签可能有其他不同的颜色例如：

<style type="text/css">.al{color: red;}.a2{color: green;}.a3{color: pink;}.p2 a{ //特殊的p2color: gray;}</style><p class="p1"><a href="" class="a1">link a 1</a> <a href="" class="a2">link a 2</a> <优艾设计网_设计百科;a href="" class="a3">link a 3</a></p><p class="p2"><a href="" class="a1">link a 1</a> <a href="" class="a2">link a 2</a> <a href="" class="a3">link a 3</a></p>

我就是不明白不理解，.p2 里面 a:hover 怎么color被重置 gray 为嘛呀，
附上链接 演示demo

谢谢大家的宝贵意见

---

qiyanxiang88 11小时前

优艾设计网_Photoshop百科

@extend

---

拽拽的闪电 11小时前

优艾设计网_Photoshop论坛

可能和css 权重有关系 id 权重为100class 为10标签* 为1伪类 为10

---

ggg0301 11小时前

优艾设计网_设计圈

希望能给你一些启示~

---

wh****5 11小时前

如我上面的问题 默认a:hover 级别为10+1 = 1优艾设计网_Photoshop交流1那么p1里面 a 权重为 10那么p2里面 a 权重为 10+1 =11(css 是从上往下，下面的设置会覆盖上面)

---