Question

我似乎无法让css转换因某些原因而起作用。我确信这是一个非常简单的错误。但是我一直在墙上撞了一个小时。我在Windows 7 64位上使用mozilla firefox 4.0.1。

<style>
a:link {
 transition: color 1s ease-in-out;
 color: #fff;
 text-decoration: none;
 text-shadow: 1px 1px #000;
}

a:hover {
 color: #0072bc;
 text-decoration: none;
 text-shadow: 1px 1px #000;
}
</style>
<a href="#">test</a>

Answer 1

css过渡是实验性的，但在某些引擎中实现。您需要使用特定属性：

-moz-transition /* for gecko based like firefox*/
-webkit-transition /* for  chrome safari ... */
-o-transition /* for opera*/

Answer 2

您需要使用-moz-前缀，因为它尚未标准化。所以：

-moz-transition: color 1s ease-in-out;

Answer 3

这也可以用jquery / jquery ui完成，所以我在这里所有的浏览器工作=） http://docs.jquery.com/UI/Effects/ClassTransitions

Answer 4

您应该查看用于CSS创作的SASS框架。您不必担心实验依赖性，因为框架会为您解决所有这些问题。

CSS过渡无效？

4 个答案: