css - Wordpress - 图像容器太大

Question

我们要求我们的 Web 开发人员将所有页面(主页、类别页面等)上的图像制作得尽可能大。这在那些横跨 3 张图像的页面上非常有效 - 它们现在又大又漂亮。

问题是显示在单个图像页面上的图像现在非常大..您必须向下滚动才能看到其他图像的缩略图。

显然他们增加了容器尺寸来做到这一点 - 我想单独保留主页和类别页面上的图像，因为它们看起来很棒，但我如何更改单个产品页面上主图像的大小，以便它现在不是那么大了吗？

网址是https://flowersforeveryone.feedmybeta.com/

任何帮助将不胜感激!谢谢:)

Answer 1

在 WordPress 中，body_class 函数为每个页面/psot/自定义帖子类型的标签添加唯一的类。这使您可以定位特定页面，例如您提到的单个产品页面。

在您的情况下，此 CSS 会减小相对图像宽度，然后减小比例高度。

.single-product.woocommerce .content-area {
  margin-top: 2.1rem;
 }
 .single-product.woocommerce div.product div.images.woocommerce-product-gallery {
  width: 40%;
  margin: -2.1rem auto 0 auto;
}

谢谢

已编辑:将 CSS 更新为您的以下评论要求。

引用:https://developer.wordpress.org/reference/functions/body_class/