可能重复:
CSS 关键帧仅适用于 Chrome
我的网站使用 css 过渡来淡入三个图标(facebook、twitter、电子邮件)上的新图像。过渡在 Chrome 上运行良好,但在 Firefox 上不行。这是css狙击手:
.link-button > div{height:79px; width:79px; display:inline-block; zoom: 1; *display:inline;
transition: 0.5s;
-moz-transition: 0.5s;
-webkit-transition: 0.5s;
-o-transition: 0.5s;}
.link-button .facebook{background:url(../img/bt_facebook.png) center center no-repeat transparent;}
.link-button .facebook:hover{background-image:url(../img/bt_facebook_over.png);}
.link-button .twitter{background:url(../img/bt_twitter.png) center center no-repeat transparent;}
.link-button .twitter:hover{background-image:url(../img/bt_twitter_over.png);}
.link-button .email{background:url(../img/bt_email.png) center center no-repeat transparent;}
.link-button .email:hover{background-image:url(../img/bt_email_over.png);}
我假设我的错误直接与 -moz-transition 相关,因为 :hover 状态有效,但不是过渡。我已经从 w3 school 复制了转换代码,所以我知道这不是错误的,但是我的 Firefox 正确地触发了在互联网上找到的 css 转换,所以我知道这不是我的浏览器有问题。这一定是我忽略的一些基本问题。
有任何想法吗?