淘宝1920海报装修代码。

流年
流年
管理员
320
文章
407.8千
浏览
评论849字数 794阅读2分38秒

今天把淘宝店铺装修了一下,添加了一个全屏海报具体代码看下。。

[toggle hide="off" title="点击展开代码" color="red"]

[html]

<div style="height:700px;" class="QdotCode">

<div class="footer-more-trigger most-footer QdotpstWVSvKL" style="border:none 0;padding:0;background-color:transparent;width:1920px;height:700px;border:none;padding:0;top:auto;left:auto;">

<div class="footer-more-trigger most-footer QdotpstWVSvKL" style="border:none 0;padding:0;background-color:transparent;width:1920px;height:700px;left:-485px;top:0px;border:none;padding:0;overflow:hidden;">

<div class="QdotlayerWVSvKL" style="height:700px;width:1920px;overflow:hidden;">

<div class="QdotwrapWVSvKL J_TWidget" data-widget-type="Carousel" data-widget-config="{&quot;effect&quot;: &quot;scrollx&quot;,&quot;easing&quot;: &quot;elasticOut&quot;,&quot;circular&quot;:true,&quot;interval&quot;:&quot;5&quot;,&quot;duration&quot;:0.5,&quot;autoplay&quot;:true,&quot;contentCls&quot;: &quot;QdotcontentWVSvKL&quot;,&quot;prevBtnCls&quot;:&quot;QdotprevWVSvKL&quot;,&quot;nextBtnCls&quot;:&quot;QdotnextWVSvKL&quot;}" style="height:700px;width:1920px;overflow:hidden;position:relative;">

<div class="most-footer footer-more-trigger" style="width:1920px;height:60px;border:none 0;padding:0;background-color:transparent;z-index:80;left:auto;top:630px;">

<ul class="ks-switchable-nav QdotpstWVSvKL" style="width:284px;height:60px;border:none 0;text-align:center;clear:both;margin:0 auto;">

<li style="list-style-type:none;float:left;width:120px;height:60px;background-color:#CCCCCC;border:#666666 1px solid;margin:0 10px;cursor:pointer;">
<img border="0" src="//gdp.alicdn.com/imgextra/i3/1089108392/TB2w.DmdVXXXXciXXXXXXXXXXXX_!!1089108392.jpg" height="60px" width="120px" />
</li>

<li style="list-style-type:none;float:left;width:120px;height:60px;background-color:#CCCCCC;border:#666666 1px solid;margin:0 10px;cursor:pointer;">
<img border="0" src="//gdp.alicdn.com/imgextra/i4/1089108392/TB2YrPHdVXXXXaBXXXXXXXXXXXX_!!1089108392.jpg" height="60px" width="120px" />
</li>

</ul>

</div>

<ul class="QdotcontentWVSvKL clearfix" style="top:0px;z-index:9;width:999999px;">

<li style="list-style-type:none;margin:0px;padding:0px;width:1920px;height:700px;float:left;">
<a target="_blank" href="//item.taobao.com/item.htm?spm=a21ag.7622616.0.0.5sagzn&amp;id=520631358601&amp;scene=taobao_shop" style="padding:0px;margin:0px;"> <img border="0" src="//gdp.alicdn.com/imgextra/i3/1089108392/TB2w.DmdVXXXXciXXXXXXXXXXXX_!!1089108392.jpg" height="700" width="1920" /></a>
</li>

<li style="list-style-type:none;margin:0px;padding:0px;width:1920px;height:700px;float:left;">
<a target="_blank" href="//item.taobao.com/item.htm?spm=a21ag.7622616.0.0.5sagzn&amp;id=520631518412&amp;scene=taobao_shop" style="padding:0px;margin:0px;"> <img border="0" src="//gdp.alicdn.com/imgextra/i4/1089108392/TB2YrPHdVXXXXaBXXXXXXXXXXXX_!!1089108392.jpg" height="700" width="1920" /></a>
</li>

</ul>

<div class="most-footer footer-more-trigger" style="width:950px;height:60px;z-index:90;top:320px;overflow:hidden;clear:both;border:none 0;background:none;left:485px;">
<span class="QdotprevWVSvKL QdotpstWVSvKL" style="width:auto;border:none 0;padding:0;background-color:transparent;float:left;cursor:pointer;"> <img data-ks-lazyload="//gdp.alicdn.com/imgextra/i3/1089108392/TB2cyS7dVXXXXcBXpXXXXXXXXXX_!!1089108392.png" src="//gdp.alicdn.com/imgextra/i3/1089108392/TB2cyS7dVXXXXcBXpXXXXXXXXXX_!!1089108392.png" width="60" height="60" /></span> <span class="QdotnextWVSvKL QdotpstWVSvKL" style="width:auto;border:none 0;padding:0;background-color:transparent;float:right;cursor:pointer;"> <img data-ks-lazyload="//gdp.alicdn.com/imgextra/i2/1089108392/TB2oYLndVXXXXccXXXXXXXXXXXX_!!1089108392.png" src="//gdp.alicdn.com/imgextra/i2/1089108392/TB2oYLndVXXXXccXXXXXXXXXXXX_!!1089108392.png" width="60" height="60" /></span>
</div>

</div>

</div>

</div>

</div>

</div>

[/html]

[/toggle]

 

你可以直接用上面的代码修改,也可以用这个工具更简单。。

只需要通过几个简单的步骤就可以生成代码了。很简单。我就不演示了。

点击下面的演示地址

流年
  • 本文由 流年 发表于2015年7月21日 14:56:20
  • 除非特殊声明,本站文章均为原创,需要转载,请留言说明!
匿名

发表评论

匿名网友
:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:
确定

拖动滑块以完成验证