有没有办法只使用 css 来转换 transform:scale 属性？答案

【问题标题】：Is there a way to transition the transform:scale property using only css?有没有办法只使用 css 来转换 transform:scale 属性？
【发布时间】：2015-08-04 03:29:27
【问题描述】：

我正在使用

transform: scaleY(0.8);

在 :hover 事件中。有没有办法随着时间的推移进行这种转变？我知道转变事物的唯一方法就是做

-webkit-transition: someparm sometime somefunction;
-moz-transition: someparm sometime somefunction;
-o-transition: someparm sometime somefunction;
transition: someparm sometime somefunction;

但我不知道如何通过转换来做到这一点。

【问题讨论】：

你应该可以使用@keyframes 和动画来做到这一点。
你的意思是transform 和transition 之类的this 吗？

标签： html css css-transitions css-transforms

【解决方案1】：

@keyframes scale {
    100% { transform:scaleY(0.8);}
    }

/* on hover */

abc:hover{
-webkit-animation:scale 3s ease infinite;
}

**尝试动画它**

【讨论】：

【解决方案2】：

transition: transform 0.4s ease-in-out 0s;

或

transition-property: transform;
transition-duration: 0.4s;
transition-timing-function: ease-in-out;
transition-delay: 0s;

像这样的

a {
  transform:scale(1);
  transition: transform 0.4s ease-in-out 0s;
}
a:hover {
    transform:scale(0.8);
}

【讨论】：