css - img scale(放大效果)不起作用

Question

我有一个问题。

我想在悬停时放大 img，但它不起作用。

<div>
<img src="https://www.apple.com/v/iphone/home/x/images/home/business_addit_large.jpg">
</div>

<style>
div {width: 500px; height: 300px; overflow:hidden}
img {display: block; margin:auto;width: 500px; height: 300px;}
img:hover {transform: scale(1,1);}
</style>

这是代码。

Answer 1

div {width: 500px; height: 300px; overflow:hidden}
img {display: block; margin:auto;width: 500px; height: 300px; transition: transform 1s;}
img:hover {transform: scale(1.1);}

<div>
<img src="https://www.apple.com/v/iphone/home/x/images/home/business_addit_large.jpg">
</div>

这只是一个拼写错误 scale(1,1) => scale(1.1)

另外，如果你想添加平滑效果，你应该添加这样的transition。