HTML+；CSS-悬停时缩放图像

我试着在悬停状态下缩放单幅图像，我有20幅图像，两行，10行。我当前的代码缩放了整行，你能帮我更正一下吗

html文件

<p class="image">
<img src="images/100.jpg" alt="100!" width="90" height="125" border="0">
<img src="images/99.jpg" alt="99!" width="90" height="125" border="0">
<img src="images/98.JPG" alt="98!" width="90" height="125" border="0">
<img src="images/97.jpg" alt="97!" width="90" height="125" border="0">
<img src="images/96.jpg" alt="96!" width="90" height="125" border="0">
<img src="images/95.jpg" alt="95!" width="90" height="125" border="0">
<img src="images/94.jpg" alt="94!" width="90" height="125" border="0">
<img src="images/93.jpg" alt="93!" width="90" height="125" border="0">
<img src="images/92.jpg" alt="92!" width="90" height="125" border="0">
<img src="images/91.jpg" alt="91!" width="90" height="125" border="0">
</p>

---

当我在每个图像之前使用

时，它工作正常，但使用此方法，我将每个图像放在一行中。

将选择器更改为：

.image:hover img

到

---

将选择器更改为：

.image:hover img

到

---

以下是一个如何缩放的示例：

* {
框大小：边框框；
}
.zoom{
填充：50px；
背景颜色：绿色；
转变：转变2；
宽度：200px；
高度：200px；
保证金：0自动；
}
.缩放：悬停{
-ms变换：比例（1.5）；/*IE 9*/
-webkit转换：比例（1.5）；/*Safari 3-8*/
转换：比例（1.5）；
}

以下是如何缩放的示例：

* {
框大小：边框框；
}
.zoom{
填充：50px；
背景颜色：绿色；
转变：转变2；
宽度：200px；
高度：200px；
保证金：0自动；
}
.缩放：悬停{
-ms变换：比例（1.5）；/*IE 9*/
-webkit转换：比例（1.5）；/*Safari 3-8*/
转换：比例（1.5）；
}

.image img:hover