过渡属性在Safari浏览器中不起作用

Question

我的网站上的Css过渡效果在safari中不起作用（在最新版本上测试）。转换在Chrome，Firefox和Opera中测试的其他浏览器中运行良好。

我的代码如下：

.navbar-inverse ul a{
     overflow: hidden;
    -webkit-transition: color 0.5s;
    -o-transition: color 0.5s;
    -moz-transition: color 0.5s;
     transition: color 0.5s;
}

.navbar-inverse  ul a::before{
    -webkit-transition: top 0.5s;
    -o-transition: top 0.5s;
    -moz-transition: top 0.5s;
     transition: top 0.5s;  
}

如何解决？之后转换也适用于safari。

Answer 1

问题是您为具有伪元素before的元素放置了transition属性。尝试为元素本身放置过渡属性。这就是我的意思：

.navbar-inverse ul a{
   overflow: hidden;
  -webkit-transition: color,top 0.5s;
  -o-transition: color,top 0.5s;
  -moz-transition: color,top 0.5s;
   transition: color,top 0.5s;
}