I've currently got a transform: rotate(45deg)
that is applied using a checkbox :checked
value, and I'm looking for a solution so the CSS transition only applies to the transform value. Right now I've got it setup like so: transition: all 1s ease
. I don't want it to apply to all though, just the transform. Right now it's applying the transition to a color:
change, which I'd like to get rid of.
我目前有一个转换:rotate(45deg),它使用复选框:checked value应用,我正在寻找一个解决方案,因此CSS转换只适用于转换值。现在我已经有了这样的设置:转换:所有的1。我不希望它适用于所有的,只是变换。现在它应用到颜色的转换:改变,我想把它去掉。
I feel like this should have been easy to find an answer to, but it's proven to be more difficult than I had imagined. Let me know if you have any questions. Thanks.
我觉得这个问题应该很容易找到答案,但事实证明,它比我想象的要困难得多。如果你有什么问题,请告诉我。谢谢。
Here's my code pen. The code in question is CSS lines 25-28.
这是我的代码的钢笔。问题中的代码是CSS第25-28行。
1 个解决方案
#1
5
You can use transition: transform 1s;
你可以使用转换:变换1s;
That is shorthand for:
这是缩写:
transition-property: transform;
transition-duration: 1s;
For prefixes, you need:
对于前缀,您需要:
-webkit-transition: -webkit-transform 1s;
/* etc, for each possibility */
#1
5
You can use transition: transform 1s;
你可以使用转换:变换1s;
That is shorthand for:
这是缩写:
transition-property: transform;
transition-duration: 1s;
For prefixes, you need:
对于前缀,您需要:
-webkit-transition: -webkit-transform 1s;
/* etc, for each possibility */