求助,怎么样调整让商品列表一行只显示四个,不要空出个位置来.图片放大

2016-07-07 15:18 来源:www.chinab4c.com 作者:ecshop专家

商品列表的图片太小,无法清晰看清楚,我想改成大概两百多像素的..而且默认一列是五个,我想改成三个就可以了.再把图片的尺寸调大,刚好占一行,我已经在后面把缩略图大小调整也重新生成过了.但图片框架好像有大小的限制,大小还是没变,只是变形了


一行放几个这个没办法改啊...请教一下大家怎么修改,听说要改CSS,不知道要在哪改呢?急等....拜托....


经过大家帮忙,问题已解决,答案在楼下,对大家有帮助的要对我也说声谢谢哦.呵呵


回答:
修改 css

兄弟,要怎么修改呢?这才是问题的关键哦,帮下菜鸟吧

在模板目录下有个styles.css文件

/* ====================
商品分类页面
==================== */
.sort a{ position:relative; bottom:5px;}
.sort input{position:relative; top:3px;}
/*商品列表显示方式*/
.goodsList{ padding:10px 10px 0 10px;}
.goodsList ul{ margin-bottom:10px;}
.goodsList ul#bgcolor{background:#fbfbfb; border-top:1px dashed #e8e8e8; border-bottom:1px dashed #e8e8e8;}
.goodsList li{float:left; padding-top:8px;}
.goodsList li.thumb{width:80px; text-align:center;}
.goodsList li.thumb img{width:50px; height:50px; border:1px solid #ccc; padding:1px;}
.goodsList li.goodsName{width:290px; margin-right:10px;}
.goodsList li.action{float:right; margin-left:10px;}
.goodsList li.action a.abg{background:url(images/bg.gif) no-repeat 0px -735px; padding-left:18px; position:relative; bottom:5px;}

已经解决了,谢谢.jiahuimina
还有版主的回答

解决方法如下我是把每行换成四个商品,然后图片大小和外框大小调大.)

改的是themes\default\stylee.css,这个文件..代码改成
/*单个商品*/
.goodsItem{width:150px; float:left; position:relative; overflow:hidden; margin:0px 14px 15px 14px;}
.goodsItem .goodsimg{width:146px; height:115px; border:2px solid #eef8ff; margin-bottom:4px;}


width:150px;这个是改边框的大小,调整为150宽度
width:146px; height:115px,这是改商品的大小,图片要比边框略小几个象素,我是差四个像素...
1.大家在调整宽度的时候要注意缩略图片的宽度要和高度成比例,不然图片会变形哦.就是说height要根据你图片的比例来调,不能照抄我的哦.
2.最后一步是在商店设置--显示设置里,把你的缩略图的大小改为:146115再点图片批量处理,处理完就OK了.

路过,学习了~有谁能帮帮我呀?求高手指点 首页 横排显示商品的数量一定致谢~!

感谢分享!实践成功了!哈哈

呵呵,学习了,我正发愁呢,谢谢楼主

不同一的模版是不是不一样呀
我用的模版找不到楼主所说的那段代码?

先看看,正找这个!

可以用IE8 IE9的调试功能找到相应的CSS。