CSS 仅按比例进行 CSS3 过渡

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/8533228/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-30 02:24:00  来源:igfitidea点击:

Css3 transition on scale only

cssscalecss-transitions

提问by Francesco Frapporti

I am missing something obvious. But the transition on only one element isn't working here.

我错过了一些明显的东西。但是只有一个元素的过渡在这里不起作用。

Here's my code.

这是我的代码。

#navigatore-servizi ul li a {
    color: #fff;
    text-decoration: none;
    text-shadow: 0 -1px 0 #008;
    display:block;
    width:240px;
    height:96px;
    background:#000;
    background-position: top center;
    line-height: 96px;
    font-family: sans-serif;
    text-transform: uppercase;
    text-align: center;
   -webkit-transition: -moz-transform .3s ease-out; 
   -moz-transition: -webkit-transform .3s ease-out; 
   -o-transition: -o-transform .3s ease-out; 
    transition: transform .3s ease-out; 
}

#navigatore-servizi ul li a:hover {
    background-position: bottom center;
   -moz-transform: scale(1.3);
   -webkit-transform: scale(1.3);
   -o-transform: scale(1.3);
   transform: scale(1.3);
    border-right: 10px solid #b00;
}

回答by Nate B

You've got your

你有你的

-webkit-transition: -moz-transform .3s ease-out; 
-moz-transition: -webkit-transform .3s ease-out; 

switched. I have to assume that's the problem.

切换。我必须假设这就是问题所在。