现在有一段代码, 在不改变主体代码的前提下,使得图片可以向左无简隙的滚动

css 样式
.productshow{width:100%}
.productshow .text{list-style-type:none; margin:0; padding:0}
.productshow .text li{line-height:25px; background:url(../t_line.gif) repeat-x bottom}
.productshow .text li A {background:url(../icons/dot1.gif) no-repeat; background-position:0 3px; padding-left:13px}
.productshow .text A:link {color: #000; text-decoration: none}
.productshow .text A:visited {color:#000; text-decoration: none}
.productshow .text A:active {color: #000; text-decoration: none}
.productshow .text A:hover {color: #B00000; text-decoration: underline}
.productshow .pic{list-style-type:none; margin:0; padding:0}
.productshow .pic li{float:left; width:120px}
.productshow .pic li p{text-align:center; line-height:160%; word-break:break-all; width:120px; overflow:auto; }
.productshow .pic li .picture{margin:0 auto; text-align:Center; width:110px; height:110px}
.productshow .pic li .picture IMG{MARGIN-TOP: expression(( 110 - this.height ) / 2); width: expression(this.width > 110 ? 110 : true); height: expression(this.height > 110 ? 110 : true); max-width: 110px; max-height: 110px; VERTICAL-ALIGN: middle; TEXT-ALIGN: center}
.productshow .pic li .sprice{text-align:center;color:#999;text-decoration:line-through}
.productshow .pic li .proname{margin:0 auto; text-align:center; line-height:160%; height:40px; word-break:break-all; width:120px; overflow:hidden}
.productshow .pic li .price{text-align:center;color:#ff0000}
.productshow .pic li .buylist{line-height:25px; text-align:center;color:#6DAADA; display:none}
.productshow .pic .list-line{width:157px}
.productshow .pic .list-line .picture-s{float:left; margin:0 auto; text-align:Center; width:50px; height:50px}
.productshow .pic .list-line .picture-s IMG{MARGIN-TOP: expression(( 45 - this.height ) / 2); width: expression(this.width > 45 ? 45 : true); height: expression(this.height > 45 ? 45 : true); max-width: 45px; max-height: 45px; VERTICAL-ALIGN: middle; TEXT-ALIGN: center}
.productshow .pic .list-line .picinfo{float:left; padding-left:12px; width:95px}
.productshow .pic li A:link {color: #000; text-decoration: none}
.productshow .pic li A:visited {color:#000; text-decoration: none}
.productshow .pic li A:active {color: #000; text-decoration: none}
.productshow .pic li A:hover {color: #B00000; text-decoration: underline}

主体代码

<table width="609" style="border:1px solid #FF8119" cellspacing="0" cellpadding="0">
              <tbody><tr>
                <td background="shop/skins/56770_com_b_002/center_bg.gif"><div class="productshow">
<ul class="pic">
<form action="#" method="post" name="LEBI_FORMBUY_0001" id="LEBI_FORMBUY_0001"><li>
<div class="picture"><a href="shop/product/default.asp?id=16" class="picborder" target="_self"><img border="0" src="shop/Pic/201009/1211144612000.jpg" {@onmouse}="" alt="2010男装秋装商"></a></div>
<div class="proname"><a href="shop/product/default.asp?id=16" title="2010男装秋装商" target="_self">2010男装秋装商</a></div>
         <p><span class="sprice">市场价:￥100.00</span></p>
<p><span class="price">购买价:￥90.00</span></p>
<p class="buylist">购买数量 <input type="text" name="pro_num_0001_16" id="pro_num_0001_16" value="1" size="3" style="width:30px;" class="form"><input type="hidden" name="pro_size_0001_16" id="pro_size_0001_16" value="-"><input type="hidden" name="pro_color_0001_16" id="pro_color_0001_16" value="-"><br><input type="button" name="button_0001_16" value="购买" onclick="javascript:addtobasket('16','0001','','1')" class="button"> <input type="button" name="fav" value="收藏" onclick="location.href='shop/user/?action=shoucang_add&id=16&product_name=2010%E7%94%B7%E8%A3%85+%E7%A7%8B%E8%A3%85%E5%95%86&backurl=http%3A%2F%2Flocalhost%3A80%2Fshop%2Fdefault%2Easp&product_type='" class="button">
</p>
</li><li>
<div class="picture"><a href="shop/product/default.asp?id=15" class="picborder" target="_self"><img border="0" src="shop/Pic/201009/1211103327386.jpg" {@onmouse}="" alt="2010男装秋装商"></a></div>
<div class="proname"><a href="shop/product/default.asp?id=15" title="2010男装秋装商" target="_self">2010男装秋装商</a></div>
         <p><span class="sprice">市场价:￥120.00</span></p>
<p><span class="price">购买价:￥120.00</span></p>
<p class="buylist">购买数量 <input type="text" name="pro_num_0001_15" id="pro_num_0001_15" value="1" size="3" style="width:30px;" class="form"><input type="hidden" name="pro_size_0001_15" id="pro_size_0001_15" value="-"><input type="hidden" name="pro_color_0001_15" id="pro_color_0001_15" value="-"><br><input type="button" name="button_0001_15" value="购买" onclick="javascript:addtobasket('15','0001','','1')" class="button"> <input type="button" name="fav" value="收藏" onclick="location.href='shop/user/?action=shoucang_add&id=15&product_name=2010%E7%94%B7%E8%A3%85+%E7%A7%8B%E8%A3%85%E5%95%86&backurl=http%3A%2F%2Flocalhost%3A80%2Fshop%2Fdefault%2Easp&product_type='" class="button">
</p>
</li><li>
<div class="picture"><a href="shop/product/default.asp?id=14" class="picborder" target="_self"><img border="0" src="shop/Pic/201009/121181193516.jpg" {@onmouse}="" alt="2010男装秋装商"></a></div>
<div class="proname"><a href="shop/product/default.asp?id=14" title="2010男装秋装商" target="_self">2010男装秋装商</a></div>
         <p><span class="sprice">市场价:￥100.00</span></p>
<p><span class="price">购买价:￥100.00</span></p>
<p class="buylist">购买数量 <input type="text" name="pro_num_0001_14" id="pro_num_0001_14" value="1" size="3" style="width:30px;" class="form"><input type="hidden" name="pro_size_0001_14" id="pro_size_0001_14" value="-"><input type="hidden" name="pro_color_0001_14" id="pro_color_0001_14" value="-"><br><input type="button" name="button_0001_14" value="购买" onclick="javascript:addtobasket('14','0001','','1')" class="button"> <input type="button" name="fav" value="收藏" onclick="location.href='shop/user/?action=shoucang_add&id=14&product_name=2010%E7%94%B7%E8%A3%85+%E7%A7%8B%E8%A3%85%E5%95%86&backurl=http%3A%2F%2Flocalhost%3A80%2Fshop%2Fdefault%2Easp&product_type='" class="button">
</p>
</li><li>
<div class="picture"><a href="shop/product/default.asp?id=11" class="picborder" target="_self"><img border="0" src="shop/Pic/201009/121101451977.jpg" {@onmouse}="" alt="2010品牌男衬衣"></a></div>
<div class="proname"><a href="shop/product/default.asp?id=11" title="2010品牌男衬衣" target="_self">2010品牌男衬衣</a></div>
         <p><span class="sprice">市场价:￥100.00</span></p>
<p><span class="price">购买价:￥100.00</span></p>
<p class="buylist">购买数量 <input type="text" name="pro_num_0001_11" id="pro_num_0001_11" value="1" size="3" style="width:30px;" class="form"><input type="hidden" name="pro_size_0001_11" id="pro_size_0001_11" value="-"><input type="hidden" name="pro_color_0001_11" id="pro_color_0001_11" value="-"><br><input type="button" name="button_0001_11" value="购买" onclick="javascript:addtobasket('11','0001','','1')" class="button"> <input type="button" name="fav" value="收藏" onclick="location.href='shop/user/?action=shoucang_add&id=11&product_name=2010%E5%93%81%E7%89%8C%E7%94%B7%E8%A1%AC%E8%A1%A3&backurl=http%3A%2F%2Flocalhost%3A80%2Fshop%2Fdefault%2Easp&product_type='" class="button">
</p>
</li><li>
<div class="picture"><a href="shop/product/default.asp?id=9" class="picborder" target="_self"><img border="0" src="shop/Pic/201009/121053257865.jpg" {@onmouse}="" alt="2010年秋冬新款特"></a></div>
<div class="proname"><a href="shop/product/default.asp?id=9" title="2010年秋冬新款特" target="_self">2010年秋冬新款特</a></div>
         <p><span class="sprice">市场价:￥100.00</span></p>
<p><span class="price">购买价:￥100.00</span></p>
<p class="buylist">购买数量 <input type="text" name="pro_num_0001_9" id="pro_num_0001_9" value="1" size="3" style="width:30px;" class="form"><input type="hidden" name="pro_size_0001_9" id="pro_size_0001_9" value="-"><input type="hidden" name="pro_color_0001_9" id="pro_color_0001_9" value="-"><br><input type="button" name="button_0001_9" value="购买" onclick="javascript:addtobasket('9','0001','','1')" class="button"> <input type="button" name="fav" value="收藏" onclick="location.href='shop/user/?action=shoucang_add&id=9&product_name=2010%E5%B9%B4%E7%A7%8B%E5%86%AC%E6%96%B0%E6%AC%BE%E7%89%B9&backurl=http%3A%2F%2Flocalhost%3A80%2Fshop%2Fdefault%2Easp&product_type='" class="button">
</p>
</li></form></ul>

posted on 2010-09-15 22:55 蜘蛛阅读(298) 评论(0) 编辑收藏所属分类: 日常琐事

新用户注册刷新评论列表


只有注册用户登录后才能发表评论。




网站导航: 博客园 IT新闻知识库 C++博客博问管理
相关文章: 现在有一段代码, 在不改变主体代码的前提下,使得图片可以向左无简隙的滚动哈佛的25个成功金句后期制作-高清压缩视频转，看电影解读转成功的销售员 SQL Server® 2008 Express with Tools pstools说明书 DOS命令之net use命令详细解释 pageload 关注中文win7 版

探索与发现

公告

常用链接

留言簿(3)

随笔分类

随笔档案

文章分类

相册

After effects

Blogger's

BT

Flex

Photoshop

Photoshop 素材

学习站点

学习论坛

影视制作

搜索

最新评论

阅读排行榜

评论排行榜