淘宝店铺基础版全屏装修步骤及代码,已经经过测试

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了淘宝店铺基础版全屏装修步骤及代码,已经经过测试相关的知识,希望对你有一定的参考价值。

1.淘宝基础版全屏海报
旺铺基础版是左右两栏的布局,那我们就把左栏的模块全部删掉,在右栏建立自己的自定义模块,在自定义模块中加入以下代码,产生的效果就是通栏效果。在“加入自己的自定义内容”这句话这里插入自定义代码比如全屏不轮播代码等。
<div class="J_TWidget" data-widget-config="{‘effect‘: ‘fade‘, ‘circular‘: true ,‘contentCls‘:‘taobaoux‘}" data-widget-type="Tabs" style="height:580px;overflow:hidden;">
<div class="taobaoux">
<div class="footer-more-trigger" style="border-bottom:medium none;border-left:medium none;padding-bottom:0px;padding-left:0px;width:950px;padding-right:0px;height:580px;border-top:medium none;top:auto;border-right:medium none;padding-top:0px;left:50%;">
<div class="footer-more-trigger" style="border-bottom:medium none;border-left:medium none;padding-bottom:0px;padding-left:0px;width:950px;padding-right:0px;height:580px;border-top:medium none;border-right:medium none;padding-top:0px;left:-575px;">


<font color="#ff0000">加入自己的自定义内容</font>

</div>

2、淘宝基础版表格布局代码

<div class="J_TWidget" data-widget-config="{&quot;effect&quot;: &quot;fade&quot;, &quot;circular&quot;:
true ,&quot;contentCls&quot;:&quot;taobaoux&quot;}" data-widget-type="Tabs" style="height:380px;overflow:hidden;">
<div class="taobaoux">
<div class="footer-more-trigger" style="border-bottom:medium none;border-left:medium none;padding-bottom:0px;left:0px;width:950px;padding-right:0px;height:580px;border-top:medium none;top:auto;border-right:medium none;padding-top:0px;left:50%;">
<div class="footer-more-trigger" style="border-bottom:medium none;border-left:medium none;padding-bottom:0px;left:0px;width:950px;padding-right:0px;height:580px;border-top:medium none;border-right:medium none;padding-top:0px;left:-480px;">
<div style="height:600px;">
<div class="footer-more-trigger" style="left:50%;top:auto;border:none;padding:0;">
<div class="footer-more-trigger" style="left:-960px;top:40px;border:none;padding:0;">
<a href="#" style="width:1920px;height:600px;display:block;" target="_blank">
<table height="30px">
<tbody>
<tr>
<td width="370px">
&nbsp;
</td>
<td width="380px">
<img src="//gdp.alicdn.com/imgextra/i3/2445509868/TB2P1MgjVXXXXbCXpXXXXXXXXXX_!!2445509868.jpg" />
</td>
<td width="20px">
&nbsp;
</td>
<td width="380px">
<a>
<div style="background-image:url(//gdp.alicdn.com/imgextra/i4/2445509868/TB2zq3ajVXXXXXgXFXXXXXXXXXX_!!2445509868.jpg);height:450px;">
<div style="position:relative;top:400px;left:30px;color:white;font-size:20px;">
男士正装 原价200元 现价100元
</div>
</div>
</a>
</td>
<td width="20px">
&nbsp;
</td>
<td width="380px">
<a><img src="//gdp.alicdn.com/imgextra/i3/2445509868/TB2RTZfjVXXXXXOXpXXXXXXXXXX_!!2445509868.jpg" /> </a>
</td>
<td width="370px">
&nbsp;
</td>
</tr>
</tbody>
</table>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

以上是关于淘宝店铺基础版全屏装修步骤及代码,已经经过测试的主要内容,如果未能解决你的问题,请参考以下文章

CSS 淘宝导航代码集合(附使用技巧)

怎么修改淘宝店铺宝贝图片尺寸的宽度

钉钉网页版全屏

淘宝店铺将导航和店招修改成通栏

iPad web app 桌面版全屏

淘宝网店装修如何拉动滚动条,背景不动,有完整的代码吗专业版的可以吗怎么设置呢