我们都知道,用css给网页设置背景图片,可以导入网络图片和本地图片。
1. 网络图片:
元素定位{background-image: url('/timg?image&quality=80&size=b9999_10000&sec=1517753496248&di=c464b97f6d0b3937307066e600043e14&imgtype=0&src=http%3A%2F%%2FimgWeb%2Fpsd%2Fhf_zw%2FZW_033.jpg'); }
2. 本地图片:
元素定位{background-image: url('../../imgs/花瓣.jpg'); }
在微信开发环境中,确信无误没有用错第二种方法,但是却无法加载出来。
而在wxml中用image标签却可以添加本地图片。
我相当不解,于是在wxss中尝试了输入网络图片地址,发现可以显示。
究其原因,是因为在微信小程序开发中本地资源图片无法通过WXSS获取,可以使用网络图片,或者 base64,或者使用<image/>标签。
综上,在微信开发过程中,要添加背景可以选择以下方式:
1. 在wxss中直接po上网络图片,将图片配置在服务器上;
2. 通过在wxml中添加内联样式或直接使用<image/>标签来设置背景;
3. 转换图片为base64格式。