如何设置不重复平铺的商铺背景图？

设置位置：登录【商务中心】—【商户后台】—【商铺设置】—【常用设置】

上传背景图后默认是重复平铺方式，这也是最常用背景设置方式。下面介绍不平铺背景图的设置方法。

注意：平铺背景和这种不平铺的，不可共用，只能二选一。

以设置商铺顶部（导航上方）背影示例。

用下面这张图做为演示，图片大小：1920px*150px，两端做了向白色渐变。（ps：如果使用窄版图片，比如宽1200px的，图片会自动居中显示）

方法步骤：

1、上传图片

2、用自定义CSS辅助

在自定义CSS中添加如下代码（注意前面的点“.”不要漏掉了）

.m_head{background: none;}
      body{background-repeat:no-repeat;background-position:center 30px;}

第一行的意思是让顶部透明，使背景图显示出来。

第二行的意思是规定背景图不平铺并设置从顶部30px的位置开始显示

效果：

顶部背景已经能正常显示了。另外会发现其它地方的背景变成白色了。其它地方使用原来的背景色，再设置“自定义背景色”即可。

3、设置“自定义背景色”为原来的“#f0f0f0”，如下图，在里面直接输入#f0f0f0

设置完成后保存。

最终效果：

示例二：

素材图片：

设置效果：

补充：自定义CSS解释

如上图，给出了商铺页面布局的尺寸，如果有需要可使用背景图配合横幅设置，来实现一些复杂的效果。

ps：还有一种背景图的设置方式，就是滚动鼠标滚轮或者拖动浏览器滚动条时，整个背景图不动，网站内容上下移动。这需要背景图铺满真个屏幕，现在显示器分辨率越来越大，会导致图片尺寸过大或者图片变形，影响体验，这种方式基本被淘汰了，这里就不详细说明方法了。

关联阅读：

如何设置商铺自定义背景图背景色？

推荐阅读：

如何修改图片的尺寸大小和构图？