广西旺铺旺网络科技有限责任公司旗下网站 广西南宁市青秀区西江大厦&&&客服热线：400-616-1425
品牌名称：唯艺设计（www.weiyi5.cc）桂ICP备号-9淘宝店铺装修教程 >
摘要：大部分店长在装修时可能会遇到这样一个问题：淘宝店铺模块之间如何去掉两个模块之间的间隙？特别是我们在将设计好的大幅版面分段切割好，想放在不同自定义模块里面，这时我们需要想办法消除自定义模块之间的间隙了。 淘宝、天猫店铺模块间隙是10px，只要掌握一点简单代码就可以解决这个问题。...
&&&&& 大部分店长在装修时可能会遇到这样一个问题：淘宝店铺模块之间如何去掉两个模块之间的间隙？特别是我们在将设计好的大幅版面分段切割好，想放在不同自定义模块里面，这时我们需要想办法消除自定义模块之间的间隙了。
&&&&& 淘宝、天猫店铺模块间隙是10px，只要掌握一点简单代码就可以解决这个问题。装修宅提醒，目前消除模块间隙只能限于两个自定义的模块，如果是官方的图片轮播、搜索店内宝贝、宝贝推荐等模块就无法与上一个模块消除10PX间隙了。
官方模块之间默认有10像素间隙，如上图。
一般情况下，两个自定义模块发布后，都会有如上图的间隙。
使用如下代码，消除店铺自定义模块之间的10PX间隙：
&div style=&height:344px;width:1920px;&&
&div class=&footer-more- trigger& style=&width:1920height:364px;left:top:margin:0;padding:0;border:0;&&
&div class=&footer-more-trigger& style=&left:-485top:-20px;margin:0;padding:0;border:0;&&
&a href=&/item.htm?spm=a1z10.3.w895.23.tiev41&id=&scene=taobao_shop& target=&_blank&&&img src=&/imgextra/i4//T2qK7RXjRaXXXXXXXX-.jpg& /&&/a&&/div&
说明：这张图片上364像素高，模块之间间隙是10PX，两个模块间隙就是20PX，所以，修改代码&div class=&footer-more-trigger& style=&left:-485top:-20margin:0;padding:0;border:0;&&，中的top:-20PX（主要修改这个参数，-30，-40自己可以试试调节）,天猫一般是-10PX，根据实际情况，有的是-10PX，有的需要是-20px,
然后再修改&div style=&height:344width:1920&&，把原本高度为height:364PX;，修改为height:344
绿色的代码就是要替换的代码，这段代码可以是一张图片，也可以是一个版面的切割图代码。例如，使用ps切割之后，会有一个html文件的，将里面的代码替换到上面的绿色代码中（&body&...&/body&之间的代码）。最后记得修改&div style=&height:344width:1920&&这里的高度。不明白可以联系站长，我有空可以教你如何修改！
使用上面的代码，实现消除自定义模块间的10像素间隙！
收集改动或原创丨 | 转载 请标明出处
本文原地址：
本文标签：
淘宝店铺装修教程/03-18
淘宝店铺装修教程/09-21
淘宝店铺装修教程/12-09
淘宝店铺装修教程/01-15
淘宝店铺装修教程/01-06
淘宝店铺装修教程/02-12
评论列表（网友评论仅供网友表达个人看法，并不表明本站同意其观点或证实其描述）
万 部 A 片高清 国产日韩 hTTp://T.CN/RtdW3KQ
请问如果是 切片的自定义怎么实现这种效果
自带模块的空白不能消除
太感谢分享者了。。看了上面的和回复网友的问题，看懂了，很好的人儿。。[亲亲]
我用了这个代码，可是第二个自定义模块的连接都没有了
深海宏添企业
这个代码到底怎么放，放哪里看不懂，很受伤[生病][泪]
在创建/编辑风格里面有一个下边距10像素可以勾选去掉的
我也是按照这么做的，间隔是可以去掉了，可是歪了我就不说了，但是问题是，它下面的都不显示了，现在想把那个主图视频给删了都找不到，
为什么我弄不了呢？加我Q吧，
按照你的代码，把下面的全部弄好了。就差一个店招，不知道怎么下手！
我就想问店招怎么弄？你这个代码用在店招上面没有用啊！能不能说一下
我不是经常都在线，你在网站底部点击“联系站长”给我留言吧，我有空都可以帮你解决~
我直接新建了一个自定义模块，把你的上述代码全部复制进去，可以看到那张红色的图，但是我把这个模块往下移，模块是下去了，但这张红色的图还是在
自定义模块的~例如你切割的图片代码，就喜欢这段代码a href= /item.htm?spm=a1z10.3.w895.23.tiev41id=scene=taobao_shop target=_blankimg s
代码放在什么位置 是在导航显示区还是放到每一个自定义模块呢！
歪妖内涵网
网站不错很漂亮，欢迎互访！
left:-485px 哪里来的？
是的，所以下个自定义模块设置需要之前基础上多10像素
这样是可以消除，但是间隙会加到下两个模块之前，也就是说本来这个间隙是10，你用这个方法去掉了，下两个模块的间隙就是20了
修改这个值left:-485px
按亲提供的方法做了，是可以消除模块之间的间隙，但是显示不全，往左边靠。
谢谢辛苦了，对我们不懂代码的来说，很值得看~
弄得这么复杂有个p用 明明一条代码的事
淘宝店铺装修教程当前位置： >
& & & 2015年无线端淘宝的流量目标要占比70%，手机淘宝店铺装修无疑是每个卖家都非常看重的一个关键，因为它关系着店铺的视觉营销效率，店铺销量转化等等，这一切都是息息相关的。而如今看到手机端淘宝的流量上涨趋势，我们作为卖家还坐得住吗？手机淘宝是一块大蛋糕，没有做好手机淘宝店铺的卖家也要抓紧时间了，及时的去抓住无线端的资源，下面317淘就和大家分享一些手机淘宝店铺装修技巧以及装修时需要注意的问题。
& & 手机淘宝店铺装修技巧
　手机淘宝店铺装修路径：我是卖家－店铺管理－手机淘宝店铺装修
　　在无线端的详情页是没有店招的，设计一个店招，这样会增强视觉，提升品牌形象
　　技巧一：内容精简，目标鲜明
　　1.原因：手机端图片缩小后文字会很小，因此不要把你所有PC端的内容都缩小照搬到无线端，在手机上顾客是看不清楚的。
　　2.原因：pc端就那么小一点地方，挑重点内容来做就行了，有wifi还好，没wifi的话别浪费买家的流量了。
　　因此手机店铺的装修一定要做得简洁，直击重点，不要把装修PC端店铺的那一段直接搬到无线端里去。
　　技巧二：不使用繁多色彩
　　颜色信息太丰富的图片，图片体积必然会增大。千万要记住这是无线端，能小则小。尽量使用单色背景，或者浅色图片，推荐使用&极简&设计理念。这样的图在无线端上看其来会很清晰和舒服。
　　最后再说下手机端的详情页制作也是比较繁琐的，当然如果大家喜欢一键制作的软件，可以在我们官网下载甩手工具箱一键制作手机详情页。
　 &技巧三：寻找手机淘宝店铺装修的问题点突破口
　　通过分析，我们发现很多店铺的无线装修存在较多的问题点的：
　　1、和众多商家一样，无线端的装修多采用照搬PC端的做法，海报直接缩小尺寸、介绍店铺信息过长、字体大小不适、大图流量过大打不开，内容展示不全面；
　　2、整店排版布局不合理。店铺内着重还是在上新宝贝的展示，不会预留位置给予热销宝贝和活动的展示；
　　3、对于自定义的模块使用不当，每款宝贝之间没有合理的间隙分隔开，导致客户不知道哪个可以点击哪个可以点击，造成跳失。
　　以上说到的种种的排版布局不合理性，长此以往，只会造成更多的跳失，不利于店铺的新客户端的积累以及店铺的转化。
　技巧四：手机淘宝店铺装修的页面优化
　　我们了解到无线端的客户有这样两大特点：一是时间碎片化；二是阅读的快餐式。一个有效吸引、高点击率的页面，在于如何在最短的时间，利用有限的设计模块，让消费者按照你清晰的视觉导购，浏览并最终形成转化。
　　对很多手机淘宝店铺来说，首要解决的就是整体的排版布局。
　　我们保留每期上新宝贝的展示区块，配合每一期的不同的拍摄主题，新增内容如下：
　　A.焦点轮播海报；
　　B.店铺促销信息（如优惠券、不同会场的入口）；
　　C.热销宝贝的展示区块。
　　以上调整的重点在于首页的前三屏不再首先陈列单品，改放模块（即分类入口或者海报），我们通过这些模块引导，可以很好地让客户一层一层地浏览，加深用户的浏览兴趣。
& & 技巧五:手机淘宝店铺装修的色调调整
　　无论是无线的首焦海报还是整体页面视觉上，想要做到首先引人注目，进而吸引人点击，就要注意页面色调的整体性、统一性。页面用色上要善于运用同类色和互补色进行搭配，以及注意页面配色的使用占比，主色的使用占比一般是整个页面的70%，辅助色为25%左右，还有一个我们叫点缀色或者提亮色的为5%左右的占比。
　技巧六：手机淘宝店铺装修的自定义模块优化
　　无线装修的模块里，新增了自定义模块，而且还能最多设置10个子模块，这对于无线端装修而言，无疑是给了很多的自定义的自由度，对无线端来说是最给力的模块。自定义模块的图片大小可以自行选择拉动但是区别于PC端的自定义模块，无线端的可视化框架是建立在图片的基础上的，不涉及html源码。
& &&手机淘宝店铺装修时需要注意的问题
　目前这个自定义模块有以下几个特点：
　1.至少四个小框才可以独立一个子模块（长宽为152*152）
　2.拉好框架会自动显示图片大小。
　此模块值得注意的是，我们在设计的时候应当考虑好在自定义模块里预留每个子模块之间的缝隙，这样做的意义是让客户清晰的区分各单独的模块图片，从而更直观引导。
　最后顺便补充一下，在手机淘宝店铺装修中，自定义模块的拉动相对其他图文模块自由，所以其可设计的自由度也就更大，只要精心布局，就可以达到既可以让新客户印象深刻，又能让老客户有新鲜感。以上就是关于手机淘宝店铺装修技巧，装修时需要注意的问题的全部内容，更多相关手机淘宝店铺装修教程请关注本栏目。
文章关键词：手机淘宝店铺装修
本文地址：/jiaocheng/shouji/1883.html，转载请说明出处，谢谢！
大家都在看
这些是最新的淘宝店铺装修:如何去掉店铺模块10px空隙？_淘宝店铺装修
当我们在做淘宝店铺装修时，会时常碰到很多棘手的问题，如何消除各种模块之间的空隙就是当中一个大问题。
我们这里说的间隙就是是两个自定义区域中间的模块，一般有10PX的间隙。
不要小看了那一点点10px的间距空隙，它极大的影响着整体装修作用的连贯性，这点我一说可能大家都身有体会了。怎么看就怎么不顺眼，那应该如何消除这些模块之间的10px缝隙呢？
其实我们可以通过删除代码来删除模块空隙。具体如何操作我们来看装修教程。
全屏通栏，全屏轮播，以及其他代码模块之间消除间隙，原理都一样。
详见下图：
消除10PX间隙后的作用如下：
未消除10PX，默认有10PX间隙，如下：
在线生成全屏海报代码（百度下有很多这样的网页工具），源代码：破950限制通栏，未消除10PX源代码，这里图片高度是364PX
&divstyle=&height:364width:1920&&
&divclass=&footer-more-trigger&
style=&width:1920height:364left:top:margin:0;padding:0;border:0;&&
&divclass=&footer-more-trigger&style=&top:left:-485margin:0;padding:0;border:0;&&
&ahref=&/item.htm?spm=a1z10.3.w4002-
.23.tiev41&id=&scene=taobao_shop&target=&_blank&&&img
src=&/imgextra/i4//T2qK7RXjRaXXXXXXXX-.jpg&/&&/a&&/div&
消除间隙后的代码：
&divstyle=&height:344width:1920&&
&divclass=&footer-more-trigger&style=&width:1920height:364left:top:margin:0;padding:0;border:0;&&
&divclass=&footer-more-trigger&style=&left:-485top:-20margin:0;padding:0;border:0;&&
&ahref=&/item.htm?spm=a1z10.3.w895.23.tiev41&id=&scene=taobao_shop&target=&_blank&&&imgsrc=&/imgextra/i4//T2qK7RXjRaXXXXXXXX-.jpg&/&&/a&&/div&
注意说明：这张图片上364像素高，模块之间间隙是10PX，两个模块间隙就是20PX，所以，修改代码&divclass=&footer-more-trigger&style=&left:-485top:-20margin:0;padding:0;border:0;&&，中的top:-20PX,天猫一般是-10PX，根据实际情况，有的是-10PX，有的需要是-20px,
然后再修改&divstyle=&height:344width:1920&&，把原本高度为height:364PX;，修改为height:344
以上内容是淘宝店铺装修：内容提要：
当我们在做淘宝店铺装修时，会时常碰到很多棘手的问题，如何消除各种模块之间的空隙就是当中一个大问题。 我们这里说的间隙就是是两个自定义区域中间的模块，一般有10PX的间隙。 不要小看了那一点点10px的间距空隙，它极大的影响着整体装修作用的连贯性，这点我一说可能大家都身有体会了。怎么看就怎么不顺眼，那...
淘宝店铺装修:如何去掉店铺模块10px空隙？相关内容
致青春·原来你还在这里于昨日上线，该剧由，吴亦凡、刘亦菲、金世佳、李沁等领先主演，俊男美女的组合得到了网友们追捧，首日票房6小时突破四千万，成绩相当不错。今天“...韩剧《任意依恋》讲述的是年少时期因令人心痛的孽缘而分开的两个男女，多年后以目中无人的Top Star申晙暎(金宇彬饰)以及卑躬屈膝又势利的纪录片PD身份的鲁乙...陈伟霆在老九门丽不仅军装造型帅，打戏更帅，动作利落身手了得，再配上那首碉堡了的张大佛爷BGM，以一敌百都不是事儿。不过本来是二人内力对抗，结果剪辑成了慢吞吞的揉...电影不可抗力2什么时候出百度云资源 不可抗力第二部下部在哪里可以看 　　BL电影《不可抗力之男仆的秘密》于6月28日正式在乐视网视频抢先上映，影片讲诉了一段由王...《大鱼海棠》终于在今天上映了，我相信肯定有不少网友和小编一样，等待了这部电影近12年。许多网友迫不及待想去电影院观看这部国产动画电影，小编也是特别激动!一段人与...淘宝店铺装修教程 >
摘要：和大家分享一个淘宝高级装修技巧，教你如何去除新旺铺上下模块之间10像素的空隙。准确的说，新旺铺专业版系统自带的第一套模板，各个模块上下之间的距离为20像素，但第二、第三套模板，距离却是10像素。此技巧主要针对第一套模板，第二、第三套模板虽然也可以用，但却没有第一套那么方便。 之...
和大家分享一个淘宝高级装修技巧，教你如何去除&新旺铺上下模块之间10像素的空隙&。准确的说，新旺铺专业版系统自带的第一套模板，各个模块上下之间的距离为20像素，但第二、第三套模板，距离却是10像素。此技巧主要针对第一套模板，第二、第三套模板虽然也可以用，但却没有第一套那么方便。
之前我曾经说过一种方法，在模块中加入&position:top:-20&，我也不知道当时是怎么想的，怎么会犯这么低级的错误！这根本就是不可能实现的！relative只是个相对定位，相对于正常位置定位，并未脱离文档流，不脱离文档流又怎么可能突破模块的界限！所以，我们要使用的定位属性是absolute绝对定位，脱离文档流，相对于浏览器窗口进行定位。但很遗憾的是，淘宝对自定义只支持相对定位，却不支持绝对定位，在自定义内输入绝对定位属性，都将被自动过滤。
但我们要想去除上下模块之间的空隙，又必须要用到absolute绝对定位，那该怎么办呢？我能想到的有两种方法，一种查找模板CSS，找到使用了绝对定位属性的类，但这种方法效率是非常低的；另一种方法是借助Widget组件，这种方法我也是今晚无意中发现的，原来借助Widget组件里的Carousel旋转木马，同样可以拿到absolute绝对定位。
&class=&J_TWidget&&data-widget-type=&Carousel&&data-widget-config=&{'contentCls':&'bbs-taobaoux-com-con','navCls':&'bbs-taobaoux-com-nav','effect':&'fade'}&&&&&&&class=&bbs-taobaoux-com-con&&style=&width:950height:100&&&&&&&&&&&style=&width:950top:&-20&&&&&&&&&&&&&&&&&&&&&&&&&&/*这里输入你的模块内容*/&&&&&&&&&&&&&&&&&&&&class=&bbs-taobaoux-com-nav&&style=&display:&&&
代码解释：
class=&bbs-taobaoux-com-nav&&&轮播导航列表，设置display:none的作用是隐藏导航区，禁止出现1、2、3这些导航数值；
class=&bbs-taobaoux-com-con&&&轮播内容列表，必须定义模块宽度与高度；
style=&width:950height:100&&&模块的宽度与高度，比如你的模块尺寸是950px*500px，那这里就应该改为style=&width:950height:480&，为什么高度是480了？因为向上移动了20个像素。
top:-20 向上移动20个像素，完美去除上下模块之间20像素的空隙。这时，应该还需要加上一个z-index属性，把模块置于顶层，但事实上我们不用多此一举，系统会自动加上这个属性。
以上是第一套模板的修改方法，第二、第三套模板的修改方法稍微有点麻烦。你必须清楚的知道，前面一个模块的高度，比如前面一个模块的高度是500px，那top:-20px就应该改为top:490px；
收集改动或原创丨 | 转载 请标明出处
本文原地址：
本文标签：
淘宝店铺装修教程/09-24
淘宝店铺装修教程/01-28
淘宝店铺装修教程/12-02
淘宝店铺装修教程/07-03
淘宝店铺装修教程/10-14
淘宝店铺装修教程/01-13
评论列表（网友评论仅供网友表达个人看法，并不表明本站同意其观点或证实其描述）
不会用不代表不能用~设置 div style=width:950top: -20 中的top值
狗屁啥用没有
淘宝店铺装修教程