淘宝首页全屏效果装修

2022年10月28日 21点热度 0人点赞

很多人问我,淘宝怎么实现全屏装修呢,其实不难哦,方法也有不同呢,希望对新手有帮助哦!

工具/原料

  • 需要用到两款软件ps、DW
  • 辅助网站:寻访百店 (全屏轮播海报制作)

方法/步骤

  1. 1

    在ps里边先做好全屏首页排版设计,切割

  2. 2

    将排版好的店铺首页上次到店铺后天图片空间里边,并且点击复制代码

  3. 3

    打开DW将图片代码粘贴到代码区

  4. 4

    点击选择图片,用方框工具框选需要添加链接的位置,在链接处复制粘贴需要点击跳转的页面链接(注意地图MAP需要不一样呢,后边可加Map_001)

  5. 5

    打开淘宝后台,选择自定义模块点击代码加以下代码复制粘贴

    <div>

     <div style="height: 130px">

     <div class="footer-more-trigger mui-display-none" style="z-index: 99; border-bottom: 0px; border-left: 0px; padding-bottom: 0px; padding-left: 0px; width: 1920px; padding-right: 0px; height: 130px; visibility: visible; border-top: 0px; top: auto; border-right: 0px; padding-top: 0px; left: 50%">

     <div class="footer-more-trigger mui-display-none" style="z-index: 99; border-bottom: 0px; border-left: 0px; padding-bottom: 0px; padding-left: 0px; width: 1920px; padding-right: 0px; height: 130px; visibility: visible; border-top: 0px; top: auto; border-right: 0px; padding-top: 0px; left: -75%">

     <div class="footer-more-trigger mui-display-none" style="border-bottom: 0px; border-left: 0px; padding-bottom: 0px; padding-left: 0px; width: 1920px; padding-right: 0px; height: 130px; visibility: visible; border-top: 0px; top: 0px; border-right: 0px; padding-top: 0px; left: -100px">

     <div style="margin: 0px auto; width: 950px">

    <!-- 以下是自己的代码 -->

     

     在这里输入要实现的代码或图片。如果只是图片要写成这样的格式: <p> <img src="图片地址" /></p>

    <!-- 以上是自己的代码 -->

     

                                            </div>

     </div>

     </div>

     </div>

     </div>

    </div>

     

    如果发现实现后的全屏效果不居中,请能过上面代码中红色数字来调整。

     

  6. 6

    具体根据自己的需求调整高度居中的数据哦,这也是从万能的度娘学来的总结的哦   希望有帮助 具体效果:叮当小铺MP;有什么不清楚的欢迎去找我哦

    END
经验内容仅供参考,如果您需解决具体问题(尤其法律、医学等领域),建议您详细咨询相关领域专业人士。

展开阅读全部

laozhao

这个人很懒,什么都没留下

文章评论