首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >WooCommerce产品图像不均匀

WooCommerce产品图像不均匀
EN

Stack Overflow用户
提问于 2014-08-17 11:57:14
回答 1查看 2.5K关注 0票数 0

我有一个WooCommerce商店,当查看所有产品/类别时,图像大小会导致一切都不均匀。

我使用了硬切和再生缩略图,这是为了平衡它,但它剃去了图像的左和右边缘。(我的大部分图像都是景观,所以这是不利的。)

是否可以设置图像占位符大小,然后允许图像在不剪切初始图像的情况下“适合”空间?所以我的风景图片在它上面和下面都添加了‘空格’,使它变得方形?

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2014-08-18 13:55:45

最简单的方法是移除硬作物选项,然后在设置中设置允许的最大尺寸。其他您可以使用HTML和CSS做的事情如下所示:

代码语言:javascript
运行
复制
.thumbnail_container {
    text-align: center;
    height: 100px;
    overflow: hidden;
}
.thumbnail_container img {
    display: block;
    max-height: 100px;
    width: auto;
}

如果图像太窄,无法适应thumbnail_container框,从而增加所需的空白,这将对图像进行居中。如果希望在图像上设置边框或其他样式,则应该将这些样式应用于thumbnail_container类,而不是图像本身。当然,100px的高度应该更改为图像上所需的(最大)高度。如果您还需要对图像进行垂直居中,则需要添加更多的标记(HTML)和CSS。

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/25348970

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档