这在 webkit 中有效,但出于某种原因 -moz-transform 在 FF 中不起作用,有什么想法吗?
<img id="heart" width="47" height="42" src="http://24.media.tumblr.com/d95e8df8385d7c4696d1211e8d8f7e64/tumblr_mm5q9hi3iF1rgpyeqo1_500.png" alt="love">
#heart {
margin-top: -10px;
margin-left: 3px;
-webkit-animation: Pulse 2s ease-out infinite;
image-rendering: -webkit-optimize-contrast;
}
@-webkit-keyframes Pulse {
0% {
-webkit-transform-origin: 50% 100%;
-webkit-transform: scale(1);
-moz-transform-origin: 50% 100%;
-moz-transform: scale(1);
}
50% {
-webkit-transform-origin: 50% 50%;
-webkit-transform: scale(1.5);
-moz-transform-origin: 50% 50%;
-moz-transform: scale(1.5);
}
100% {
-webkit-transform-origin: 50% 50%;
-webkit-transform: scale(1);
-moz-transform-origin: 50% 50%;
-moz-transform: scale(1);
}
}
最佳答案
所有的 -moz-
规则都保存在 -webkit-
@
规则中,因此只有 WebKit 会看到它们(并忽略它们)
关于html - -moz-transform-origin 在 firefox 中不工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16363522/