【CSS】a标签hover和active标签不生效 （可清除默认样式）

【方法一】：

修改各个伪类css的顺序，按照:link->:visited->:hove->:active的顺序写。

示例【推荐】：

.clear_a {
  text-decoration: none;
  color: rebeccapurple;
}
.clear_a:link {
  text-decoration: none;
  color: black;
}
.clear_a:visited {
  text-decoration: none;
  color: white;
}
.clear_a:hover {
  text-decoration: none;
  color: lightcyan;
}
.clear_a:active {
  text-decoration: none;
  color: red;
}

不按照上述顺序会导致部分属性颜色不能正常显示。

【方法二】：

尝试在类前面添加body。
例如:

body a:active {
  text-decoration: none;
  color: black;
}

body a:hover {
  text-decoration: none;
  color: lightcyan;
}

示例【能实现，但不推荐】：

.clear_a {
  text-decoration: none;
  color: white;
}

body .clear_a:hover {
  text-decoration: none;
  color: lightcyan;
}

/* .clear_a:link {
  text-decoration: none;
  color: red;
} */

.clear_a:visited {
  text-decoration: none;
  color: white;
}

body .clear_a:active {
  text-decoration: none;
  color: lightcyan;
}