如何在CSS缩放中获得较慢的动画？

Question

我编写了这段代码来制作菜单动画

   .main-navigation a:hover{
        transform: scale(1.1)!important;

但是我想随着时间或其他因素来降低动画速度

Answer 1

添加transition: 0.3s（或您想要的其他任何时间）。

Answer 2

这应该有效：

.main-navigation a {
    transition: transform 250ms;
    transform-origin: center center;
}
.main-navigation a:hover{
    transform: scale(1.1) !important;
}

一个友好的建议：尝试设置CSS，这样就不必使用!important。