1.什么是固定背景?我的理解就是背景固定不动,当你的店铺内容超过两屏以上,往下拉时只有中间的内容在动,背景是固定不动。
这个方法淘宝集市与天猫店铺通用。专业版基础版都可以使用。
2.下面的是缩小后的整体截图:下面是22寸显示器看到的效果。)如下图:
在22寸显示器下看,那1920宽的全屏海报就有点穿帮了,觉得怪怪的。就是喜欢这效果的另当别论。
3.15寸笔记本显示如下:
固定背景大小是看您个人需要而做的,我建议是2200*1080PX吧。
不然小了的话大显示器看就有点像穿帮的感觉。当然您特意要这么做那我不强求。
标注如下:
4.再往下看背景的原样:尺寸是2200*1080px.这个的尺寸主要是为了配合现在主流显示器。因为现在目前最大显示器一般是22寸。看下图,是不是上面安装好的看不到两边的手机二维码以及左边的一些圆形装饰LOGO呢?这就是因为背景是固定的,让最上面的全屏海报给遮住了。
再看下上面的背景图,中间淡蓝色的区域,【这个区域我是加了一张白色1000PX宽的透明填充色得来,这个要与不要随你。删除全部一样的也可以哦】就是给内容区当背景的哦。为什么要加1000宽的透明区。这样的效果看起来比950更宽。还有两边的二维码LOGO,不能离中心950区域太远,太远了那么小显示器就会看不到两边的内容。
所以得出:做图时内容尽量按小显示器考虑,(当然你不能小于淘宝的规定950宽。)尺寸尽量按主流大显示器来定。所以我定成2200*1080px;现在还需要考滤到图片体积大小,体积太大,浏览器速度会变慢。这也是我们准掌柜美工需要考虑的。
上次我们把固定背景做图部分说了下,下面我们来讲下代码部分:
body {
background:
url(http://img04.taobaocdn.com/imgextra/i4/1055778042/TB23LbDXVXXXXc4XXXXXXXXXXXX-1055778042.png)
center top no-repeat fixed;
}
说明:body{ background: url(这里是固定图片地址,把做好的固定背景上传空间替换括号里的汉字。) center top no-repeat fixed;
}
把上面的源代码复制到导航CSS自定义区里面:
1.店铺装修【导航】上点击编辑
2.粘贴到【显示设置】里面:如下图
3.小结:
用上传到你淘宝相册空间做好的那张2200*1080px的图片替换括号里蓝色的地址部分。
点击确应就可以发布或预览看效果了。
最后再调整下:
如果发布或预览没有看到有显示。那可能是和默认背景色充突了。那我们就要按下面的方法把系统默认的背景给去掉。
1.点击左上角【样式管理】
2.再选择【背景设置】
3.再【页面设置】把页面背景色的钩钩去掉,再去掉页面背景图,再点击保存发布或预览效果。
小结:如果还不显示;
请检查地址是否完好,或是不小心把括号也替换掉了。或者其它的标点符号错了。【标点符号都是英文状态下输入的,不要有中文的标点符号哦。】
再检查一次。
如果还不行,那你得再看看发布的时间,今天是2014.07.26日零晨2:00写的。这段代码至从2012新旺铺升级发布就支持用到现在了。