Webkit 变换在悬停伪时旋转在 safari 中不起作用

Question

我有一个列表项，为每个列表项设置了一个伪边框，我的悬停效果在谷歌浏览器中有效，但在 safari 中失败，它们都使用相同的渲染引擎，为什么它不起作用？

.page-content ol li:before {
      background: #338ec9;
      background: url(../images/tie.png) no-repeat 0;
      margin-bottom: 1em;
      padding-left: 35px;
      font-size: 1.2em;
  position: absolute;    
  left: 0;
  top: -2px;
  height: 25px;
  width: 17px;
  line-height: 25px;
  font-size: 12px;
  text-align: center;
  border-radius: 2em;
  color: transparent;
  transition: 0.6s;     
}
.page-content ol li:hover:before {        
  -webkit-transform: rotate(-360deg);
  transform: rotate(-360deg);
}

Answer 1

add

-webkit-transition:0.6s;

自

.page-content ol li:before

它应该做到：
http://www.w3schools.com/css/css3_transitions.asp