效果图
虽然国庆还有一个多月的时间，但是做淘宝从来都是不打没准备的仗，更何况这一次的国庆和中秋离得这么近，大家更是要打起一百分的精神去准备。今天，小编为大家带来了国庆节的全套
网店装修代码，包括导航CSS代码、店招自定义代码、页尾代码和店铺自定义代码。
要提醒大家自定义代码安装之前必须搬家，店招自定义代码，页尾自定义代码和导航CSS代码不需要搬家。小编想说，国庆
网店装修怎么办，甩手全套代码来相伴。
动态效果导航
导航CSS代码
.skin-box-bd .menu-list,.skin-box-bd .menu-list .menu,.menu-list .menu-selected,.menu-list .menu-selected .link,.skin-box-bd .menu-list .link,.menu-list .menu-selected .link,.menu-list .link,.skin-box-bd .menu-list .menu-selected .link .title,.skin-box-bd .menu-list .menu-hover .link,.menu-list .menu-hover .link,.all-cats,.skin-box-bd .all-cats .link,.skin-box-bd .popup-content .cats-tree,.popup-content .cats-tree .snd-pop-inner,.skin-box-bd .popup-content,.skin-box-bd .popup-content .cats-tree .cat-hd-hover,.skin-box-bd .popup-content .cats-tree .fst-cat .snd-pop .snd-cat-hd-hover{background:none transparent;}.skin-box-bd{background:url(http://img02.taobaocdn.com/imgextra/i2/263834014/TB2PuHJapXXXXbHXXXXXXXXXXXX_!!263834014.png) center bottom repeat transparent;}.skin-box-bd .menu-list .menu,.all-cats .link{border:0px;}.skin-box-bd .popup-content .cats-tree .fst-cat{border-top:0px;}.skin-box-bd .popup-content{background:url(http://img03.taobaocdn.com/imgextra/i3/58604862/TB2tKR1aFXXXXbaXpXXXXXXXXXX-58604862.png) no-repeat bottom right #000;padding-top:10px;padding-bottom:60px;border-radius:5px;opacity:1;}.skin-box-bd .ks-popup-hidden{margin-top:0;opacity:1;}.skin-box-bd .ks-popup-shown{margin-top:10px;opacity:0.5;transition:all 0.3s;-moz-transition:all 0.3s;-webkit-transition:all 0.3s;-o-transition:all 0.3s;}.skin-box-bd .popup-content .ks-popup-hidden{opacity:1;}.skin-box-bd .popup-content .ks-popup-shown{color:#FFF;margin-top:0;opacity:0.95;transition:all 0.5s;-moz-transition:all 0.5s;-webkit-transition:all 0.5s;-o-transition:all 0.5s;}.skin-box-bd .popup-content .cats-tree .snd-pop-inner{background:#000000;border-radius:0 5px 5px 5px;opacity:0.95;}.skin-box-bd .menu-list .menu-selected .link .title,.skin-box-bd .menu-list .link .title,.skin-box-bd .all-cats .link .title,.skin-box-bd .popup-content .cats-tree .fst-cat .cat-name,.skin-box-bd .popup-content .cats-tree .fst-cat .snd-pop .snd-cat-hd a{color:#FFFFFF;}.skin-box-bd .popup-content .cats-tree .cat-hd-hover{background-color:#FFF;color:#000000;}.skin-box-bd .menu-list .menu{background:url(http://img04.taobaocdn.com/imgextra/i4/263834014/TB2YBvKapXXXXbAXXXXXXXXXXXX_!!263834014.gif) center 100px no-repeat;transition:all 0.5s;-moz-transition:all 0.5s;-webkit-transition:all 0.5s;-o-transition:all 0.5s;}.skin-box-bd .menu-list .menu-hover{background:url(http://img04.taobaocdn.com/imgextra/i4/263834014/TB2YBvKapXXXXbAXXXXXXXXXXXX_!!263834014.gif) center 0 no-repeat;}.skin-box-bd .menu-list .menu .title{transition:all 1s;-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s;}.skin-box-bd .popup-content .cats-tree .cat-hd-hover a.cat-name{color:#666;}.skin-box-bd .popup-content .cats-tree .cat-hd-hover a.cat-name:hover{padding-left:25px;transition:all 0.5s;-moz-transition:all 0.5s;-webkit-transition:all 0.5s;-o-transition:all 0.5s;}.skin-box-bd .popup-content .cats-tree .fst-cat .snd-pop .snd-cat-hd a.snd-cat-name{color:#F8F8F8;}.zhenyao_wu .zhen{-moz-transition:all 1s ease-in;-webkit-transition:all 1s ease-in;-o-transition:all 1s ease-in;transition:all 1s ease-in;}.zhenyao_wu .zhen .off{visibility:hidden;display:block;}.zhenyao_wu .zhen:hover .off{visibility:inherit;}.zhenyao_wu:hover .htrans-ml0{transform:translateX(-100%);-moz-transform:translateX(-100%);-webkit-transform:translateX(-100%);-o-transform:translateX(-100%);-ms-transform:translateX(-100%);}.zhenyao_wu:hover .htrans-mr0{transform:translateX(100%);-moz-transform:translateX(100%);-webkit-transform:translateX(100%);-o-transform:translateX(100%);-ms-transform:translateX(100%);}
.zy_QqedZ_b .zy_QqedZ1,.zy_QqedZ_b .zy_QqedZ2{width:100%;border:0;padding:0;margin:0;background:url(http://img02.taobaocdn.com/imgextra/i2/263834014/TB2Hq.IapXXXXbdXXXXXXXXXXXX_!!263834014.png) repeat;top:0;transition:all 0.9s;-moz-transition:all 0.9s;-webkit-transition:all 0.9s;-o-transition:all 0.9s;opacity:0;}.zy_QqedZ_b .zy_QqedZ1{left:-100%;}.zy_QqedZ_b .zy_QqedZ2{left:100%;}.zy_QqedZ_b:hover .zy_QqedZ1,.zy_QqedZ_b:hover .zy_QqedZ2{left:0;transition:all 0.9s;-moz-transition:all 0.9s;-webkit-transition:all 0.9s;-o-transition:all 0.9s;opacity:100;}.zy_QqedZ_b:hover .zy_QqedZ:hover .zy_QqedZ1{left:-100%;top:-100%;opacity:0;}.zy_QqedZ_b:hover .zy_QqedZ:hover .zy_QqedZ2{left:100%;top:100%;opacity:0;}
.htrans-scale0{-moz-transform:scale(0);-o-transform:scale(0);-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0);}.zhen_nav_yao .footer-more-trigger{width:190px;height:380px;opacity:1;border:0;padding:0;top:0;transition:all 0.5s;-moz-transition:all 0.5s;-webkit-transition:all 0.5s;-o-transition:all 0.5s;}.zhen_nav_yao .tu01{left:0;}.zhen_nav_yao .tu02{left:190px;}.zhen_nav_yao .tu03{left:380px;}.zhen_nav_yao .tu04{left:570px;}.zhen_nav_yao .tu05{left:760px;}.zhen_nav_yao .footer-more-trigger:hover{width:190px;height:760px;border:0;padding:0;top:-190px;opacity:1;z-index:9;opacity:0.01;}.zy_QqedZ{overflow:hidden;position:relative;border:0;padding:0;margin:0;}
店招自定义代码
<div style="background:url(http://img03.taobaocdn.com/imgextra/i3/770458061/TB2AKw7apXXXXbPXpXXXXXXXXXX-770458061.gif) no-repeat scroll center center rgba(0,0,0,0);color:#333;height:110px;overflow:hidden;" data-widget-config="{"png":true,"png_tag":true}" data-widget-type="Compatible">
<div style="float:left;height:110px;width:300px;">
</div>
</div>
页尾代码
<div style="clear:both;overflow:hidden;color:#000;">
<div style="height:28px;line-height:28px;background:#000;text-align:center;">
<a style="padding:0 10px;color:#FFF;" target="_blank" href="店铺地址/?scene=taobao_shop">返回首页</a> <a style="padding:0 10px;color:#FFF;" target="_blank" href="店铺地址/?scene=taobao_shop">新品发布</a><a style="padding:0 10px;color:#FFF;" target="_blank" href="店铺地址/?scene=taobao_shop">热销爆款</a><a style="padding:0 10px;color:#FFF;" target="_blank" href="店铺地址/?scene=taobao_shop">活动专区</a>
</div>
<div style="clear:both;overflow:hidden;text-align:left;background:#FFF;zoom:1;border-bottom:1px solid #E7E7E7;padding:10px 0;">
<dl style="width:190px;float:left;overflow:hidden;border-right:1px dashed #E7E7E7;">
<dt style="color:#000;padding:10px 0 10px 15px;">
<b>温馨提示</b></dt><dd style="padding:0 15px 10px 15px;line-height:18px;color:#999;">购买后如发现质量问题请不要直接差评，否则不予任何售后服务。</dd></dl><dl style="width:189px;float:left;overflow:hidden;border-right:1px dashed #E7E7E7;">
<dt style="color:#000;padding:10px 0 10px 15px;"><b>关于快递</b></dt><dd style="padding:0 15px 10px 15px;line-height:18px;color:#999;">所有宝贝均为实物拍摄各显示器显示不同，对色彩要求高的买家请慎拍。</dd></dl><dl style="width:190px;float:left;overflow:hidden;border-right:1px dashed #E7E7E7;"><dt style="color:#000;padding:10px 0 10px 15px;"><b>关于色差</b></dt><dd style="padding:0 15px 10px 15px;line-height:18px;color:#999;">所有宝贝均为实物拍摄各显示器显示不同，对色彩要求高的买家请慎拍。</dd></dl><dl style="width:189px;float:left;overflow:hidden;border-right:1px dashed #E7E7E7;"><dt style="color:#000;padding:10px 0 10px 15px;"><b>关于退换货</b></dt><dd style="padding:0 15px 10px 15px;line-height:18px;color:#999;">如不满意，顾客可自理来回运费调换，如商品质量问题，本店承担运费调换。</dd></dl><dl style="padding:10px 0 0 12px;float:left;"><dd style="float:left;margin-right:10px;"><a style="display:block;width:75px;height:75px;background:url(http://img03.taobaocdn.com/imgextra/i3/770458061/TB2OTnCXVXXXXXmXpXXXXXXXXXX-770458061.gif) no-repeat;" href="http://favorite.taobao.com/popup/add_collection.htm?id=店铺ID&itemtype=0&scene=taobao_shop" target="_blank"></a></dd><dd style="float:left;"><a style="display:block;width:75px;height:75px;background:#000 url(http://img04.taobaocdn.com/imgextra/i4/770458061/TB253_DXVXXXXXJXXXXXXXXXXXX-770458061.gif) no-repeat;" href="#"></a></dd></dl></div>
</div>
店铺自定义代码
<div style="height:629px;"> <div class="footer-more-trigger sn-simp" style="left:50%;top:-22px;border:none;padding:0;"> <div class="footer-more-trigger sn-simp" style="left:-1050px;top:0px;padding:0;"> <div class="J_TWidget" data-widget-config="{'duration':0.1,'activeTriggerCls':'.tshop-pbsm-shop-nav-ch','effect':'scrollx','interval':0.1,'activeIndex':1,'navCls':'nav_yao','contentCls':'content_yao','autoplay':true}" data-widget-type="Carousel" style="width:1920px;height:650px;"> <div style="display: none; position: relative;"> <ul class="content_yao" style="position: absolute; width: 999999px;"> <li class="ks-switchable-panel-internal1257" style="display: block; float: left;"> </li> </ul> </div> <ul class="nav_yao" style="height:650px;width:1920px;"> <li class="ks-switchable-trigger-internal1256 tshop-pbsm-shop-nav-ch"> <div class="zhenyao_wu"> <a href="#" class="zhen footer-more-trigger sn-simp" style="top:0px;left:0px;padding:0;border:none;width:1920px;height:650px;background:url(http://img.tbzxiu.com/05/3.jpg) no-repeat;"></a> <div style="height:250px;top:145px;left:480px;position:relative;"> <div data-title="来自网店装修网" style="height:400px;"> <div class="footer-more-trigger" style="left:50%;width:950px;height:400px;right:auto;top:auto;padding:0;border:none;margin:0px 0px 0px 0px;left:auto;"> <div class="footer-more-trigger" style="left:0;top:0;border:none;padding:0;margin:0px;"> <div class="J_TWidget" data-widget-config="{'duration':0.1,'activeTriggerCls':'.tshop-pbsm-shop-nav-ch','effect':'scrollx','interval':0.1,'activeIndex':1,'navCls':'aa_001_n','contentCls':'aa_001_c','autoplay':true}" data-widget-type="Carousel" style="width:950px;height:400px;position:relative;"> <div class="aa_001_c" style="left: 0px; width: 999999px; display: none; position: absolute;"> <div style="float: left; display: block;" class="ks-switchable-panel-internal1261"> </div> </div> <div class="aa_001_n"> <div style="background:no-repeat;width:auto;height:400px;" class="ks-switchable-trigger-internal1260 tshop-pbsm-shop-nav-ch"> <div> <div class="zy_QqedZ_b" style="width:950px;left:auto;top:auto;height:400px;margin:0px;padding:0px;"> <table> <tbody> <tr> <td> <div class="zy_QqedZ" style="height:200px;width:317px;"> <a href="#" target="_blank"><img class="pic" src="http://img03.taobaocdn.com/bao/uploaded/i3/14894032066332192/T1D6ZZXoJfXXXXXXXX_!!0-item_pic.jpg_310x310.jpg"></a> <div style="height:200px;width:317px;border:0;padding:0;" class="zy_QqedZ1 footer-more-trigger"> </div> <div style="height:200px;width:317px;border:0;padding:0;" class="zy_QqedZ2 footer-more-trigger"> </div> </div> </td> <td> <div class="zy_QqedZ" style="height:200px;width:317px;"> <a href="#" target="_blank"><img class="pic" src="http://img03.taobaocdn.com/bao/uploaded/i3/14894032066332192/T1D6ZZXoJfXXXXXXXX_!!0-item_pic.jpg_310x310.jpg"></a> <div style="height:200px;width:317px;border:0;padding:0;" class="zy_QqedZ1 footer-more-trigger"> </div> <div style="height:200px;width:317px;border:0;padding:0;" class="zy_QqedZ2 footer-more-trigger"> </div> </div> </td> <td> <div class="zy_QqedZ" style="height:200px;width:317px;"> <a href="#" target="_blank"><img class="pic" src="http://img03.taobaocdn.com/bao/uploaded/i3/14894032066332192/T1D6ZZXoJfXXXXXXXX_!!0-item_pic.jpg_310x310.jpg"></a> <div style="height:200px;width:317px;border:0;padding:0;" class="zy_QqedZ1 footer-more-trigger"> </div> <div style="height:200px;width:317px;border:0;padding:0;" class="zy_QqedZ2 footer-more-trigger"> </div> </div> </td> </tr> <tr> <td> <div class="zy_QqedZ" style="height:200px;width:317px;"> <a href="#" target="_blank"><img class="pic" src="http://img03.taobaocdn.com/bao/uploaded/i3/14894032066332192/T1D6ZZXoJfXXXXXXXX_!!0-item_pic.jpg_310x310.jpg"></a> <div style="height:200px;width:317px;border:0;padding:0;" class="zy_QqedZ1 footer-more-trigger"> </div> <div style="height:200px;width:317px;border:0;padding:0;" class="zy_QqedZ2 footer-more-trigger"> </div> </div> </td> <td> <div class="zy_QqedZ" style="height:200px;width:317px;"> <a href="#" target="_blank"><img class="pic" src="http://img03.taobaocdn.com/bao/uploaded/i3/14894032066332192/T1D6ZZXoJfXXXXXXXX_!!0-item_pic.jpg_310x310.jpg"></a> <div style="height:200px;width:317px;border:0;padding:0;" class="zy_QqedZ1 footer-more-trigger"> </div> <div style="height:200px;width:317px;border:0;padding:0;" class="zy_QqedZ2 footer-more-trigger"> </div> </div> </td> <td> <div class="zy_QqedZ" style="height:200px;width:317px;"> <a href="#" target="_blank"><img class="pic" src="http://img03.taobaocdn.com/bao/uploaded/i3/14894032066332192/T1D6ZZXoJfXXXXXXXX_!!0-item_pic.jpg_310x310.jpg"></a> <div style="height:200px;width:317px;border:0;padding:0;" class="zy_QqedZ1 footer-more-trigger"> </div> <div style="height:200px;width:317px;border:0;padding:0;" class="zy_QqedZ2 footer-more-trigger"> </div> </div> </td> </tr> </tbody> </table> </div> </div> </div> </div> </div> </div> </div> </div> </div> <a href="#" class="zhen htrans-ml0 footer-more-trigger sn-simp" style="top:0px;left:0px;padding:0;border:none;width:960px;height:650px;background:url(http://img.tbzxiu.com/05/1.jpg) no-repeat;"></a> <a href="#" class="zhen htrans-mr0 footer-more-trigger sn-simp" style="top:0px;left:960px;padding:0;border:none;width:960px;height:650px;background:url(http://img.tbzxiu.com/05/2.jpg) no-repeat;"></a> <a href="#" class="zhen htrans-scale0 footer-more-trigger sn-simp" style="top:380px;left:855px;padding:0;border:none;width:218px;height:267px;"></a> <a href="#" class="zhen htrans-scale0 footer-more-trigger sn-simp" style="top:23px;left:552px;padding:0;border:none;width:807px;height:345px;"></a> </div> </li> </ul> </div> </div> </div> </div>
*本站部分文字及图片均来自于网络，如侵犯到您的权益，请及时通知我们删除。联系信息：
甩手网
企业QQ 800055007
下载
微信
新浪微博
甩手抖音号
