javascript - 淡入淡出链接悬停不起作用

Question

我使用以下方法创建淡入淡出的链接悬停:

 a:link {color:#333333; text-decoration: none;
-o-transition:.5s; 
-ms-transition:.5s;
-moz-transition:.5s;
-webkit-transition:.5s;
 transition:.5s;} 
a:visited {color:#FF0033; text-decoration: none;}
a:hover {color:#000000; text-decoration: none;}
a:active {color:#FF0033; text-decoration: none;}
a:focus {outline-style: none;}

我使用 Wordpress，我的网站对不同的链接使用不同的颜色(例如，颜色 A 的菜单、颜色 B 的类别链接、颜色 C 的标题等)

由于某些奇怪的原因，淡入淡出悬停对于类别链接(例如灰色框中的“Conciertos”)工作得很好，但对于其余链接则不能正常工作。它会进行某种缓慢的悬停。请查看 flamencosrosas.com 了解我的意思。请问有人可以帮忙吗？

非常感谢!

Answer 1

您应该指定要转换的内容，因此:

 a {color:#FF0033; text-decoration: none;
-o-transition: color .5s; 
-ms-transition: color .5s;
-moz-transition: color .5s;
-webkit-transition: color .5s;
 transition: color s;} 
a:visited {color:#FF0033; }
a:hover {color:#000000; }
a:active {color:#FF0033; }
a:focus {outline-style: none;}

Fiddle here ，我将过渡设为 1s，以便它们更加引人注目。

此外，您的意思是链接默认为#333333 吗？ #333333 和 #000000 之间的过渡非常轻微，您可能根本没有注意到过渡的发生。