当我们在做淘宝店铺装修时,会时常碰到很多棘手的问题,如何消除各种模块之间的空隙就是当中一个大问题。
我们这里说的间隙就是是两个自定义区域中间的模块,一般有10PX的间隙。
不要小看了那一点点10px的间距空隙,它极大的影响着整体装修效果的连贯性,这点我一说可能大家都身有体会了。怎么看就怎么不顺眼,那应该如何消除这些模块之间的10px缝隙呢?
其实我们可以通过删除代码来删除模块空隙。具体如何操作我们来看装修教程。
全屏通栏,全屏轮播,以及其他代码模块之间消除间隙,原理都一样。
详见下图:
消除10PX间隙后的效果如下:
未消除10PX,默认有10PX间隙,如下:
在线生成全屏海报代码(百度下有很多这样的网页工具),源代码:破950限制通栏,未消除10PX源代码,这里图片高度是364PX
<divstyle="height:364px;width:1920px;">
<divclass="footer-more-trigger"
style="width:1920px;height:364px;left:auto;top:auto;margin:0;padding:0;border:0;">
<divclass="footer-more-trigger"style="top:auto;left:-485px;margin:0;padding:0;border:0;">
<ahref="/item.htm?spm=a1z10.3.w4002-
5114819895.23.tiev41&id=36581499806&scene=taobao_shop"target="_blank"><img
src="/imgextra/i4/1927022064/T2qK7RXjRaXXXXXXXX-1927022064.jpg"/></a></div>
</div>
</div>
消除间隙后的代码:
<divstyle="height:344px;width:1920px;">
<divclass="footer-more-trigger"style="width:1920px;height:364px;left:auto;top:auto;margin:0;padding:0;border:0;">
<divclass="footer-more-trigger"style="left:-485px;top:-20px;margin:0;padding:0;border:0;">
<ahref="/item.htm?spm=a1z10.3.w4002-5114819895.23.tiev41&id=36581499806&scene=taobao_shop"target="_blank"><imgsrc="/imgextra/i4/1927022064/T2qK7RXjRaXXXXXXXX-1927022064.jpg"/></a></div>
</div>
</div>
注意说明:这张图片上364像素高,模块之间间隙是10PX,两个模块间隙就是20PX,所以,修改代码<divclass="footer-more-trigger"style="left:-485px;top:-20px;margin:0;padding:0;border:0;">,中的top:-20PX,天猫一般是-10PX,根据实际情况,有的是-10PX,有的需要是-20px,
然后再修改<divstyle="height:344px;width:1920px;">,把原本高度为height:364PX;,修改为height:344px;