当我们在网页中插入图片时，有时候需要对图片的比例进行设定。CSS提供了多种方法让我们能够轻松设置图片的宽高比例

/* 设定图片宽高比例 */
.my-img {
width: 400px;
height: auto;
aspect-ratio: 16/9;
}
/* 按比例缩放图片 */
.my-img {
width: 50%;
height: auto;
object-fit: cover;
aspect-ratio: 16/9;
}
/* 给图片添加白边，让比例变为 4:3 */
.my-img {
width: 300px;
height: 225px;
padding: 20px;
box-sizing: border-box;
aspect-ratio: 4/3;
}

在上述代码中，我们使用了aspect-ratio属性来指定图片的比例。通过这个属性，我们可以设置宽高比例为任何值。

同时，我们还可以使用object-fit: cover让图片按比例缩放，不会变形，始终充满整个元素。如果不想让图片铺满整个元素，可以使用padding设置白边，以达到类似于等比缩放的效果。

总之，使用CSS设定图片的比例很简单，根据自己的需求设定不同的宽高比例，可以让网页看起来更美观更整洁。