首页 > 家居生活 > 电子商务 >

如何去掉淘宝店铺首页全屏海报之间的空白间隙

来源:互联网 2023-02-21 16:10:29 472

简简单单去掉淘宝店铺(专业版)首页全屏海报衔接之间的空白间隙的方法,这个问题烦了我一天后终于找到解决的方法,这里和大家分享一下,如果有不对的地方,欢迎共同探讨!PLC办公区 - 实用经验教程分享!

工具/原料

  • 店铺账号

方法/步骤

  • 1

    我的首页布局如图,保留了一个店招的位置,下面插了3个自定义内容区,为方便后面叙述,我用数字标好了1、2、3、4,这个布局是打算做首页全屏海报的。PLC办公区 - 实用经验教程分享!

    如何去掉淘宝店铺首页全屏海报之间的空白间隙PLC办公区 - 实用经验教程分享!

  • 2

    生成全屏海报代码(有想了解的可以进入这个链接http://jingyan.baidu.com/article/4f7d5712c92b041a2119275f.html),这里就不赘述了,添加好代码,首页是全屏海报了,但是1与2,2与3,3与4之间都出现了空白的间隙,如图PLC办公区 - 实用经验教程分享!

    如何去掉淘宝店铺首页全屏海报之间的空白间隙PLC办公区 - 实用经验教程分享!

    如何去掉淘宝店铺首页全屏海报之间的空白间隙PLC办公区 - 实用经验教程分享!

  • 3

    1与2之间就是导航条与全屏海报之间的间隙很好解决,如图,页头下边距10像素关闭,就解决了。PLC办公区 - 实用经验教程分享!

    如何去掉淘宝店铺首页全屏海报之间的空白间隙PLC办公区 - 实用经验教程分享!

  • 4

    下面我们重点的是要解决2与3,3与4之间的空白间隙,需要改变代码中的高度值(修改你全屏代码里面的,第三个 DIV里面的 top,你的代码里面默认是 top:auto; 你只需要把第三个DIV里面的替换成top:-20px; 就可以了)(一般改成-20就行了,也有特殊的需要你自己慢慢测试数值)PLC办公区 - 实用经验教程分享!

  • 5

    接着说我怎么消除2与3之间间隙,如图top:auto;替换成top:-20px;就消除空白间隙了,一定要记得做完后点确定。PLC办公区 - 实用经验教程分享!

    如何去掉淘宝店铺首页全屏海报之间的空白间隙PLC办公区 - 实用经验教程分享!

    如何去掉淘宝店铺首页全屏海报之间的空白间隙PLC办公区 - 实用经验教程分享!

  • 5此文章未经授权抓取自百度经验
  • 6

    3与4,我开始也是想步骤5一样替换,但是空白间隙只是减少,没有消除,然后我就尝试的测试高度值,发现改变成top:-57px;空白间隙就消除了,如果你发现替换这组代码间隙减小了,您可以测试一下什么数值适合,top:-20px;(不是固定的)PLC办公区 - 实用经验教程分享!

    如何去掉淘宝店铺首页全屏海报之间的空白间隙PLC办公区 - 实用经验教程分享!

  • 注意事项

    • 空白间隙消除后,最后你一定要记得点发布,要不就白做了!
    • 全屏海报尺寸宽度1920,高度可以自定,我是切成3张图,分别插入3个自定义区

    以上方法由办公区教程网编辑摘抄自百度经验可供大家参考!PLC办公区 - 实用经验教程分享!


    标签: 淘宝空白海报店铺间隙

    办公区 Copyright © 2016-2023 www.bgqu.net. Some Rights Reserved. 备案号:湘ICP备2020019561号统计代码