继承人视觉：http ://cl.ly/image/2L3g1d0W1r1Y
文字褪色很好，但左侧的图像是即时的，不会与文字同时褪色。如何让它们在所有浏览器中同时淡入？它似乎在 chrome 中运行良好，但在 Firefox 或 Safari 中却不行。
我对发生的事情有点困惑，但这是我的 html：
<ul class="action">
<li><a class="visit-site" href="http://google.com">Visit Site</a></li>
<li><a class="back-to-top" href="#portfolio">Back to top</a></li>
</ul>
这是CSS：
ul.action a.visit-site {
background: transparent url('../images/arrow-small-right-rest.png') no-repeat 0 2px;
padding-left: 18px;
color: #57585a;
-webkit-transition: 0.5s all ease;
-moz-transition: 0.5s all ease;
transition: 0.5s all ease;
-o-transition-duration: 0.5s all ease;
}
ul.action a.visit-site:hover {
background: transparent url('../images/arrow-small-right-over.png') no-repeat 0 2px;
color: #3ee1df;
}
使用雪碧：
ul.action a.back-to-top{
background: transparent url('../images/sprite.png') no-repeat 0 2px;
padding-left: 18px;
width: 13px;
height: 13px;
color: #57585a;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
-webkit-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
transition: all 0.5s ease;
}
ul.action a.back-to-top:hover{
background-position: 0 -63px;
color: #3ee1df;
}