问题描述： 写页面的时候都会默认重置 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{ //特殊的p2          color: 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

谢谢大家的宝贵意见