CSS3过渡无效

我无法让过渡到 this page工作,任何人都知道为什么？

div.sicon a {
    transition: background 0.5s linear;
    -moz-transition: background 0.5s linear; /* Firefox 4 */
    -webkit-transition: background 0.5s linear; /* Safari and Chrome */
    -o-transition: background 0.5s linear; /* Opera */
    -ms-transition: background 0.5s linear; /* Explorer 10 */
}

解决方法

过渡更像是动画.

div.sicon a {
    background:-moz-radial-gradient(left,#ffffff 24%,#cba334 88%);
    transition: background 0.5s linear;
    -moz-transition: background 0.5s linear; /* Firefox 4 */
    -webkit-transition: background 0.5s linear; /* Safari and Chrome */
    -o-transition: background 0.5s linear; /* Opera */
    -ms-transition: background 0.5s linear; /* Explorer 10 */
}

因此,您需要通过操作调用该动画.

div.sicon a:hover {
    background:-moz-radial-gradient(left,#cba334 24%,#ffffff 88%);
}

还要检查浏览器支持,如果你仍然有任何问题,你要做什么！检查样式表中的css-overrides并检查行为：***.htc css hacks ..可能有一些事情会覆盖你的过渡！

你应该看看这个：http://www.w3schools.com/css/css3_transitions.asp

原文地址：https://www.jb51.cc/css/217450.html