css - 使外部图像适合容器

Question

我在 woocommerce 附属商店工作。（https://salespotters.nl/shop）我使用插件 Datafeedr 导入产品，并使用插件“外部图像”来显示外部图像，而不是导入它们。图像托管在附属网站的网站上。

现在我的产品图像不再适合产品容器了。（见截图）当我还在导入图像时，我曾经生成缩略图。由于图像是外部网址，现在我无法编辑它们。我刚刚开始并且还在学习 css，但是有没有办法让所有图像都适合相同大小的容器？

（图片是手机截的，电脑上是一样的）

截屏

它与此代码一起使用，很抱歉给您带来不便！：

#main .eiportrait{
    object-fit: contain;
}

标签： csswoocommerce

Answer 1

.image-div {
object-fit: contain;
}