微信小程序之 如何添加背景图片 & 包大小超限解决方案

在PC端，给页面添加本地背景图片的写法为：

background-image: url("../images/local_image.png"); 

在微信小程序端则不能通过这种方式来操作，官方建议我们使用 base64 或 image 标签，或者网络图片来解决。

1.base64方式

首先需要将背景图片使用编码base64进行转换，网址如下：

http://tool.chinaz.com/tools/imgtobase/

转换完成后会生成对应的编码文本：

之后在对应的wxss文件中引用：

background-image: url("转换后的编码文本")

会发现这个文本超级长，而微信对包的大小是有限制的，多几个背景图片引用，包大小会容易超限。

2.image 标签方式

利用流布局，给z-index设置层级，将 image 标签置于底层：

wxml:

<view class='background