css图片变大变小步骤(css图片由大变小)

在网页设计中，经常需要使用图片。有时候我们想要让图片由大变小，这时候就需要使用 CSS。在下面的代码中，我们可以看到如何使用 CSS 使图片由大变小。

img {
transition: transform .5s;
}
img:hover {
transform: scale(.5);
}

上面的代码中，我们定义了一个图片的 CSS 样式。在 `img` 中，我们使用 `transition` 表示图片缩放的时候需要半秒钟的时间。在 `img:hover` 中，我们使用 `transform: scale(.5)` 来表示鼠标悬停在图片上时，图片需要缩小到原来的一半。这是因为当 `scale` 的参数小于 1 时，图片会缩小。

除了 `scale` 之外，还有其他的 transform 参数可以使用。比如，我们可以使用 `rotate` 来旋转图片：

img {
transition: transform .5s;
}
img:hover {
transform: rotate(45deg);
}

上面的代码中，我们使用了 `rotate(45deg)` 表示图片需要旋转 45 度。

总之，CSS 的 transform 属性可以用来控制图片的大小和旋转，让网页更加生动有趣。