我一直在调整wordpress网站上的图像大小,图像大小不一样,也没有正确对齐。但在产品页面内,它看起来大小正常,但在商店/主页(产品页面)中,所有图像都以较大的尺寸显示。如何修复wordpress中的图像大小我不知道。请参考我的网站(www-dot-carolinegoodwin-dot-com 并建议我如何解决此问题。
非常感谢您的帮助。
我一直在调整wordpress网站上的图像大小,图像大小不一样,也没有正确对齐。但在产品页面内,它看起来大小正常,但在商店/主页(产品页面)中,所有图像都以较大的尺寸显示。如何修复wordpress中的图像大小我不知道。请参考我的网站(www-dot-carolinegoodwin-dot-com 并建议我如何解决此问题。
非常感谢您的帮助。
WooCommerce的CSS将图像扩展到其父级的100%<div>
, 如图所示:
ul.products li.product a img {
-moz-transition: all 0.2s ease-in-out 0s;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
display: block;
height: auto;
margin: 0 0 8px;
**width: 100%;**
}
您只需使用!important
另一个CSS文件中的声明。此外,您可以将其重写为width: auto
并更改margin: 0 0 8px
在该规则中设置为margin: 0 auto 8px auto
将这些图像居中放置div
容器首先,确保样式表被正确包含。在chrome inspector中,我发现:
编辑:我替换了这张图片,因为我注意到它很难阅读,所以我放大并拍摄了另一张截图。
我不确定你的图片样式是否包含在此文件中,但我的第一步是确保所有内容都包含在内。确保在授予样式时(正如您应该的那样)使用get\\u template\\u directory\\u uri(),如下所示:
wp_register_style( \'custom-style\', get_template_directory_uri() . \'/path/to/css\' );
wp_enqueue_style( \'custom-style\' );
如果这不是问题所在,并且样式也包括在内(前面提到的样式表是另一个样式表),那么我过去所做的就是编写一个css来为我想要的所有图像设置相同宽度的样式(使用类或您拥有的东西)。当WordPress自动将高度属性直接放入html时,这不起作用。在这种情况下,我编写了一个快速jQuery脚本,用于搜索页面上的所有图像并删除height属性。$(document).ready(function(){
$("img").removeAttr(\'height\');
});
css中只有一个width属性,浏览器应该自动进行相应的调整。但是,您必须包含!在css末尾很重要,因为内联属性胜过样式表。我创建了一个自定义主题(仪表板中的style.css)/* Theme Name: Client customisations Description: Child theme for the client Website Author: Me Author URI: http://example.com/about/ Template: aries Version: 1.0.0 */&