微信小程序背景图片设置
微信小程序通过background-image设置背景:只支持网络图片和base64图片,不支持本地图片
线上图片设置步骤如下
- 在网站https://image.kieng.cn/ 上将本地图片转为网络图片
background-image: url('https://img12.360buyimg.com/ddimg/jfs/t1/179678/33/8152/541505/60c064e5Ed7b21529/530e86904e7a1869.png');
base64图片设置步骤如下:
- 在网站http://www.jsons.cn/img2base64/上将图片转成base64格式的文本
- 在WXSS中使用以上文本:background-image: url(“data:image/png;base64,iVBORw0KGgo=…”);
- /* 大型背景图片写法 */
.container{
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
height: 100%;
background-repeat:no-repeat;
background-size:100% 100%;
-moz-background-size:100% 100%;
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAu4AAAU2CAYAAADK1zM...');