我正在使用 CSS 进行测试,并遇到了一个奇怪的行为,其中transform:rotate不起作用,这是一个动画没有发生的例子:jsFiddle
CSS
.close {
width:100px;
height:100px;
background:#00f;
color:#fff;
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
-ms-transform: rotate(0deg);
transform: rotate(0deg);
}
.close:hover {
-webkit-transform: rotate(-180deg);
-moz-transform: rotate(-180deg);
-o-transform: rotate(-180deg);
-ms-transform: rotate(-180deg);
transform: rotate(-180deg);
}
.close, .close:hover {
-webkit-transition:rotate .2s ease-in-out;
-moz-transition:rotate .2s ease-in-out;
-o-transition:rotate .2s ease-in-out;
-ms-transition:rotate .2s ease-in-out;
transition:rotate .2s ease-in-out;
}
为什么这不起作用?
谢谢 ;)