回首页
当前位置: 主页 > 装修素材 > 免费模板 >

淘宝950px宽浅蓝色小清新商品导航栏装修模板代码

分享到:
时间:2015-05-18 22:07来源:未知 作者:admin 点击:

 小清新风格,淘宝店铺商品导航代码模块:免邮专区、上新专区、爆款专区、折扣专区等四个分栏。

分栏上的图片可以自己修改,大小是230*214。


950宽度四款主打宝贝的分类图片导航栏功能,返回顶部,正品保证、百分百实物拍摄、迅速发货和热忱服务承诺等。

使用方法:复制下面的代码直接放在页尾自定义区就可以了,使用代码前请将代码中的图片上传到自己的图片空间。

下面是该代码的效果图片:
 




代码如下:

<DIV class=tb-module-bd>
<DIV style="TEXT-ALIGN: left; ZOOM: 1; FONT-FAMILY: 微软雅黑; COLOR: #fff; OVERFLOW: hidden">
<UL style="OVERFLOW: hidden">
<LI style="MARGIN: 0px 15px 0px 0px; WIDTH: 225px; FLOAT: left; OVERFLOW: hidden"><A style="DISPLAY: block; OVERFLOW: hidden; TEXT-DECORATION: none" href="http://www.53shop.com" target=_brank><table style="WIDTH: 100%; DISPLAY: block; BACKGROUND: url(http://img03.taobaocdn.com/imgextra/i3/52995017/TB2VVLEcXXXXXaPXXXXXXXXXXXX-52995017.jpg) no-repeat center 0px; HEIGHT: 214px; OVERFLOW: hidden"></table><SPAN style="PADDING-BOTTOM: 15px; PADDING-LEFT: 20px; PADDING-RIGHT: 20px; DISPLAY: block; BACKGROUND: #8fd3c8; PADDING-TOP: 15px"><B style="DISPLAY: block; MARGIN-BOTTOM: 6px; COLOR: #fff; FONT-SIZE: 20px">免邮专区</B><SPAN style="LINE-HEIGHT: 18px; DISPLAY: block; COLOR: #fff">全场满158元包邮 偏远地区除外</SPAN></SPAN></A></LI>
<LI style="MARGIN: 0px 15px 0px 0px; WIDTH: 225px; FLOAT: left; OVERFLOW: hidden"><A style="DISPLAY: block; OVERFLOW: hidden; TEXT-DECORATION: none" href="http://www.taobao.com" target=_brank><table style="WIDTH: 100%; DISPLAY: block; BACKGROUND: url(http://img04.taobaocdn.com/imgextra/i4/52995017/TB2W.rBcXXXXXbIXXXXXXXXXXXX-52995017.jpg) no-repeat center 0px; HEIGHT: 214px; OVERFLOW: hidden"></table><SPAN style="PADDING-BOTTOM: 15px; PADDING-LEFT: 20px; PADDING-RIGHT: 20px; DISPLAY: block; BACKGROUND: #8fd3c8; PADDING-TOP: 15px"><B style="DISPLAY: block; MARGIN-BOTTOM: 6px; COLOR: #fff; FONT-SIZE: 20px">上新专区</B><SPAN style="LINE-HEIGHT: 18px; DISPLAY: block; COLOR: #fff">每周三 上午十点 上新</SPAN></SPAN></A></LI>
<LI style="MARGIN: 0px 15px 0px 0px; WIDTH: 225px; FLOAT: left; OVERFLOW: hidden"><A style="DISPLAY: block; OVERFLOW: hidden; TEXT-DECORATION: none" href="http://www.taobao.com" target=_brank><table style="WIDTH: 100%; DISPLAY: block; BACKGROUND: url(http://img04.taobaocdn.com/imgextra/i4/52995017/TB21d_GcXXXXXXDXXXXXXXXXXXX-52995017.jpg) no-repeat center 0px; HEIGHT: 214px; OVERFLOW: hidden"></table><SPAN style="PADDING-BOTTOM: 15px; PADDING-LEFT: 20px; PADDING-RIGHT: 20px; DISPLAY: block; BACKGROUND: #8fd3c8; PADDING-TOP: 15px"><B style="DISPLAY: block; MARGIN-BOTTOM: 6px; COLOR: #fff; FONT-SIZE: 20px">爆款专区</B><SPAN style="LINE-HEIGHT: 18px; DISPLAY: block; COLOR: #fff">掌柜爆款推荐 数量有限</SPAN></SPAN></A></LI>
<LI style="MARGIN: 0px; WIDTH: 225px; FLOAT: left; OVERFLOW: hidden"><A style="DISPLAY: block; OVERFLOW: hidden; TEXT-DECORATION: none" href="http://www.taobao.com" target=_brank><table style="WIDTH: 100%; DISPLAY: block; BACKGROUND: url(http://img01.taobaocdn.com/imgextra/i1/52995017/TB2m_2AcXXXXXcOXXXXXXXXXXXX-52995017.jpg) no-repeat center 0px; HEIGHT: 214px; OVERFLOW: hidden"></table><SPAN style="PADDING-BOTTOM: 15px; PADDING-LEFT: 20px; PADDING-RIGHT: 20px; DISPLAY: block; BACKGROUND: #8fd3c8; PADDING-TOP: 15px"><B style="DISPLAY: block; MARGIN-BOTTOM: 6px; COLOR: #fff; FONT-SIZE: 20px">折扣专区</B><SPAN style="LINE-HEIGHT: 18px; DISPLAY: block; COLOR: #fff">折扣活动正在进行时!</SPAN></SPAN></A></LI></UL></DIV></DIV>

·新手想开女装、鞋子、化妆品网店可点此向双皇冠卖家咨询


------分隔线----------------------------


推荐内容
优秀装修模板