我希望背景为黑色,鼠标悬停时文本为白色,背景为白色,鼠标输出为黑色

Question

我发现了这个很棒的教程http://tympanus.net/codrops/2011/07/12/animated-text-and-icon-menu/

我遇到了困难:

例如,我希望背景为黑色,鼠标悬停时文本为白色,背景为白色,鼠标输出为黑色.我怎样才能做到这一点？

因为每当我尝试在鼠标悬停时更改背景颜色时,文本会在鼠标输出时获得背景相同的颜色.

感谢大家 :)

Answer 1

试试这个:

<a class="my_link" href="#">Link</a>

CSS

.my_link {
  color: black;
  background-color: white;
}

.my_link:hover {
  color: white;
  background-color: black;
}

演示:http://jsfiddle.net/YXPFh/