Question

我有这个用于我的默认css，这正是我想要的大部分网页（RED，然后它在悬停时强调）

  a:link, a:visited{
      color: #F00;
       text-decoration: none;
   }
   a:hover, a:visited:hover{
      color: #F00;
       text-decoration: underline;
   }

然而在某些情况下，我希望它是白色的，但在悬停时仍然会变红，我希望在我需要的时候覆盖白色，因为它远远不如其他风格。

我试过

a href="/" style="color:#FFF">Home

这会覆盖两个部分的颜色，这有助于它为什么这样做，但我希望它只覆盖静态链接而不是覆盖悬停。

任何帮助将不胜感激！感谢

Answer 1

你可以使用一个类，看看这个

article {
  background: #ccc;
  padding: 20px;
}

a:link, a:visited{
  color: #F00;
  text-decoration: none;
}
a:hover, a:visited:hover{
  color: #F00;
  text-decoration: underline;
}

a.white:link, a.white:visited{
  color: #FFF;
  text-decoration: none;
}
a.white:hover, a.white:visited:hover{
  color: #F00;
  text-decoration: underline;
}

<article>
	<p>
		<a href="#">normal</a>
	</p>

	<p>
		<a href="#" class="white">alternate</a>
	</p>
</article>

Answer 2

使用定义了颜色白色的类，然后将此类应用于应为白色的每个锚点。在CSS ......

a.white:link, a.white:visited {
    color:#ffffff;
}

在HTML中......

<a href="#" class="white">...</a>

Answer 3

只需使用一个类。

body {
  background: gray;
}
a.whiteLink {
   color: white;
}
a {
   color: #F00;
   text-decoration: none;
}
a:hover {
   color: #F00;
   text-decoration: underline;
}

<a href="/" class="whiteLink">Home</a>

CSS;与Hover的链接; 2链接颜色共享悬停

3 个答案: