Jewelry模板3个经典问题，高手帮忙解决下

2016-07-07 16:13 来源：www.chinab4c.com 作者：ecshop专家

Jewelry模板问题
问题一：商品列表图片互相覆盖，请问下 要调整CSS哪个地方
http://baby163.cn/category-2-b0-%25C5%25AE%25CD%25AF.html
问题二：IE8下错位严重，如何修改
问题三：缩略图质量的默认值已调到100 但 感觉还是不很清晰 还有没有别的方法

跪求答案 万分 万分感谢！

/*单个商品外围框架（此方法在火狐和ie8下面会产生3px边距）*/
.goodsbox{
width:180px;
*width:180px;
min-height:1px;
display: -moz-inline-stack;
display: inline-block;
text-align:center;
vertical-align: top;
zoom:1;
*display:inline;
_height:1px;
margin-top:10px;
}
.goodsbox .imgbox{
width:170px;
border:1px solid #ccc;
margin:0 auto 25px auto;
overflow:hidden;
}
.goodsbox .imgbox img{ padding:2px 0;}
.mod2{
border:1px solid #dfdfdf; background-color:#ffff; position:relative;
}
.mod2 .more{position:absolute;top:0px; right:20px;*top:8px;}
.mod2 span{
display:block; position:absolute; overflow:hidden; height:23px;
}
.mod2 span.TL{
background:url(images/tit1.gif) no-repeat 0px -88px; left:-1px; top:-1px; width:24px;_top:0px;
}
.mod2 span.TR{
background:url(images/tit1.gif) no-repeat -32px -88px; right:-1px; top:-1px; width:13px;_top:0px;_right:0px;
}
.mod2 h2{ background-color:#f3f3f3; border-bottom:1px solid #dfdfdf; height:21px; padding-left:38px; line-height:21px; color:#747474;}
.ContantBlank{ padding:10px 5px;}
.mod3 h2{ border-bottom:1px solid #e1e1e1; border-top:1px solid #e8e8e8; background-color:#fff; line-height:22px; color:#3f3f3f; padding-left:10px;}
.Triangle{ background:url(images/dot.gif) no-repeat 0px 4px; line-height:22px; padding-left:8px;}
.Ad2{ width:156px; height:70px; border:1px solid #e8e8e8; overflow:hidden;}
.mod4{ background:url(images/titbg.gif) no-repeat right top; width:740px;}
.mod4 .New{ background:url(images/tit2.gif) no-repeat 0 0; width:150px; height:25px;}
.mod4 .BestTit{ background:url(images/tit2.gif) no-repeat 0 -31px; width:150px; height:25px;}
.mod4 .HotTit{ background:url(images/tit2.gif) no-repeat 0 -60px; width:150px; height:25px;}
.mod5{ border:1px solid #f0d2fa; background-color:#faf0fc; color:#523c52;}
.mod5 .contant{ background-color:#fff; margin:5px; padding:8px;}
/*best*/
.Best h2{
float:left; font-weight:100; margin-right:10px; line-height:22PX;
}
.Best h2 a,.Best h2 a:visited{color:#FFF; font-weight:bold;}
.Best .h2bg a,.Best .h2bg a:visited{color:#FFF; font-weight:normal;}
.H2Line{ float:left; font-weight:normal; color:#fff; padding:2px 8px 0 0px;}
.ProductWid{ padding:0 5px 10px 5px;}
.Ad3{ width:740px; height:100px;overflow:hidden; padding:10px 0;}
.PublicBlank{ padding:4px 3px;}
#ECS_ORDER_QUERY form{ display:inline;}
/*help*/
.helpbox{
border:1px solid #dfdfdf; padding:5px 5px 5px 50px;
}
.helpbox .goodsbox{
width:170px; *margin:0 2px 0 3px;
}
.helpTit{
height:24px; line-height:24px; font-size:14px; color:#fff; font-weight:bold; background:url(images/help.gif) no-repeat center;
text-align: center;margin-bottom:5px; margin-right:50px;
}
.helpList{
padding-left:10px;
}
.links{
background:#fff; padding:10px;
}
.links img,.links .linkTxt{
display:block; width:88px; height:31px; border:1px solid #ccc; background:#fff; margin:0 10px 0 0; float:left; text-align:center; line-height:31px;
}
.Pagefooter{ background-color:#d97aad; height:44px; line-height:44px; color:#fff;}
.Pagefooter a:link, .Pagefooter a:visited, .Pagefooter a:hover, .Pagefooter a:active{ color:#fff;}
/*top10*/
#top10{
padding:5px 8px;
}
#top10 li{
cursor:pointer;
}
#top10 li .first{
padding-bottom:5px; margin-bottom:3px;
}
#top10 li .first img{
position:relative;top:1px;
}
#top10 li .last{ padding-bottom:5px;margin-bottom:8px; display:none;
}
#top10 li.cur .first{
display:none;
}
.wd120{ width:136px; }
#top10 li.cur .last{
display:block;
}
#top10 li.cur .last img{
border:1px solid #ccc;
width:130px;
height:120px;
}
.ur_here{ font-weight:normal;}
.ur_here a:link {color: #806b80; font-weight:normal;}
.ur_here a:visited {color: #806b80;font-weight:normal;}
.ur_here a:hover {color: #806b80;font-weight:normal;}
.ur_here a:active {color: #806b80;font-weight:normal;}
/*goods*/
.GoodTit{ border-bottom:2px solid #ebe6ed; margin-bottom:10px;}
.GoodTit h1{line-height:20px; font-size:14px;}
.GoodsProperty{ width:740px;}
.GoodsProperty .GoodsTxt{ width:283px;}
.Goodpromotion{
background:#f6f6f6;
border:1px solid #e8e8e8;
padding:8px;
margin:5px 0;
}
.Goodpromotion p a:link
{text-decoration:underline;
color:#295ad0;}
.GoodsProperty .GoodsTxt li{ background:url(images/txtlist.gif) bottom no-repeat; line-height:26px; padding-left:14px; color:#7f7f7f;}
.GoodsProperty .GoodsTxt li.NoLine{ background:url(images/goodsdot.gif) no-repeat 2px 6px; padding-left:14px;}
.GoodsProperty .GoodsTxt li.Line{ background:url(images/Line.gif) no-repeat bottom; padding-left:14px;}
.GoodsProperty a:link, .GoodsProperty a:visited, .GoodsProperty a:active{ color:#a660a7;}
.GoodsProperty a:hover{color:#000;}
.infotit{ background:url(images/goodtit.gif) repeat-x; height:36px; padding-left:30px;}
.infotit h2{ background-color:#FFF; border:1px solid #f7e1ed; border-bottom:none; float:left; padding:5px 10px; margin-top:7px; color:#8a458b;}
.infotit h2.h2bg{ background:url(images/goodtitone.gif) repeat-x; height:28px; line-height:28px;margin:7px 4px 0 4px;padding:0px 10px;border:1px solid #fff; border-bottom:none; font-weight:normal; color:#fff;}
.tagcontent{ border:1px solid #f7e1ed; padding:8px;}
.tagcontent .goodsbox{width:139px;}
#focuscont{
width:356px;
height:300px;
line-height:300px;
border:1px solid #ccc;
overflow:hidden;
margin-bottom:5px;
background-color:#f3f3f3;
padding:50px 10px;
}
#focuscont p{ text-align:center;}
#focuscont p img{
vertical-align:middle;
text-align:center;
border:1px solid #8d8c8c; margin:0 9px;
margin:0 10px;
*margin-top: expression(( 300 - this.height ) / 2);
}
#focustab{
width:76px;
}
#focustab .topcolor{ background:url(images/xtop1.gif) no-repeat center; cursor:pointer; height:34px;}
#focustab .bottomcolor{ background:url(images/xbottom1.gif) no-repeat center;cursor:pointer; height:34px;}
#focustab .top{ background:url(images/xtop.gif) no-repeat center; cursor:pointer;height:34px;}
#focustab .bottom{ background:url(images/xbottom.gif) no-repeat center;cursor:pointer;height:34px;}
#items{height:330px; *height:310px; _height:320px; overflow:hidden; margin-left:4px;}
#items li{
width:66px; height:60px;
}
#items li img{
height:54px;
width:54px;
display:block;
}
#items li a{
background:url(images/bg_pic_1.gif) no-repeat 0 0;
/*padding:1px 1px 2px 9px;*/
padding:1px 1px 2px 9px;
margin:5px 1px 0 0px;
display:block;
}
#items li a.act{
background:url(images/bg_pic.gif) no-repeat 0 0;
padding:3px 3px 2px 9px;
text-align:center;
}
#items li a.act img{
border:none;
}

回答：
1 调整缩略图大小
2 浏览器的兼容性，建议找一些经验比较丰富的模板设计师看下
3 可以提高原图的清晰度。

我可以帮你测试