淘宝全屏海报代码 淘宝全屏海报代码解决思路?

做过淘宝或者天猫店铺装修的同志,肯定会经常遇到一个很尴尬的问题,就是为啥本地写好的代码,放店铺里面就是不能全屏显示呢,只能显示950或者990像素宽度 。(可能这个问题很多人知道,不过考虑到很多人也许不知道所以决定写个教程帮助大家)
有同志要问了,米色老湿你的全屏代码跟别人的全屏代码哪里不一样呢?
我们都知道淘宝和天猫店铺版本是不一样的,所以代码有时候会不一样,我的全屏代码,是可以天猫和淘宝通用的 。并且无论你内容宽度是多少,都能完美的全屏居中显示 。而且使用起来也是很方便 。废话不多说 进入正题:
一:为什么店铺里面不能全屏
看上图代码会发现,自定义模块框架内 一个class名为 skin-box-bd 的哥们,带有2个样式 width:750px; overflow:hidden;
有同志要问了,这有什么问题 。上面2个样式意思是,宽度750px;溢出隐藏 。顾名思义就是放在自定义模块里面的内容,如果宽度超过750,那么超过的部分就会隐藏,自然就不能全屏了、
二:解决思路
说思路前,先说下,要想全屏店铺里面只能使用定位实现 。然而淘宝不允许店铺里面商家使用定位(相对定位除外)和外边距负值 。那就需要好好琢磨下如何实现了 。这里我利用双重定位,对需要全屏的内容进行两次移动,从而达到全屏的效果
三:具体实现代码
【内容】
参数剖析:
【高度2】:【高度】-【去下边距】
【店铺类型】:天猫店和淘宝专业版 这里修改成960
【去下边距】:自定义模块之间的距离,天猫和淘宝专业版 这里写10 ,基础版店铺这里写20.如果不需要去掉自定义模块之间的距离,就写 0
【淘宝全屏海报代码 淘宝全屏海报代码解决思路?】【高度】:需要全屏的内容整体高度
【宽度】:需要全屏的内容整体宽度
【内容】:这里整个替换为你需要全屏的代码
注意:替换的时候【】这个括号也一起替换了
四:拓展说明
虽然写的很清晰,可能会有一些同志 还是觉得很麻烦,所以我又专门,编写了一个在线生成的工具,只需要按照说明,添加内容,点击按钮自动生成需要的代码 。工具地址(复制地址在浏览器打开)
http://www.mgsns.com/portal.php?mod=topic&topicid=7
这篇教程就先写到这里 。有上面其他问题可以去代码交流群(群号:101527468)交流学习
好了,这篇文章的内容金华号就和大家分享到这里!

    推荐阅读