为什么用css样式做出来的商品列表下边总是对不齐，css样式中哪里出错了，高人帮忙看看

html-css027

为什么用css样式做出来的商品列表下边总是对不齐，css样式中哪里出错了，高人帮忙看看,第1张

你要放也把全部的代码放出来啊，下面的html没有也不好判断

css这个东西需要熟练掌握才能知道哪里出问题，看到你写了这么多padding，margin,问题应该就出在这里了，padding,margin这些会叠加，或者不叠加，这个出来效果是不一样的

真不了解就建议固定高度，然后写一个overflow:hidden就解决了

WooCommerce产品图片有三种尺寸：

1、Single Product Image：是最大的缩略图，用在产品详情页面展示产品大图

2、Catalog Images：用在shop首页、相关产品、交叉销售和增量销售中

3、Product Thumbnails：最小的缩略图，用在购物车页、购物车小工具，产品详情页大图下方那一堆小图也是这个尺寸.

4、下述所有代码都应放在主题的functions.php中

add_filter( 'woocommerce_output_related_products_args', 'wc_custom_related_products_args' )

function wc_custom_related_products_args( $args ){

$args = array(

'posts_per_page' =>3,

'columns' =>3,

'orderby' => 'rand'

)

return $args

}

5、只更改数量无法达到想要的效果，还需要修改样式表，在主题的style.css里添加如下样式：

woocommerce .related ul li.product,

woocommerce .related ul.products li.product,

woocommerce-page .related ul li.product,

woocommerce-page .related ul.products li.product{

width:30%

}