Html CSS转换不起作用?

Html CSS转换不起作用?,html,css,css-transitions,Html,Css,Css Transitions,出于某种原因,我似乎无法让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;

出于某种原因,我似乎无法让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>

a:链接{
过渡:颜色1s易于输入输出;
颜色:#fff;
文字装饰:无;
文本阴影:1px 1px#000;
}
a:悬停{
颜色:#0072bc;
文字装饰:无;
文本阴影:1px 1px#000;
}

您需要使用
-moz-
前缀,因为它尚未标准化。因此:

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

css转换是实验性的,但在一些引擎中实现。 您需要使用特定的属性:

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

这也可以通过jquery/jqueryui来完成,因此我在这里的所有浏览器中都可以使用=)

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

请不要担心,实验性也意味着语法可能会发生更改。我理解,我只是忘记了这是一个新的css属性,它仍然需要特定于浏览器的前缀。当IE10pp2出现时,可能需要-ms transition。如果您想了解更多信息,请查看我编写的教程: