今天ui真机验收样式的时候, 有个页面的背景图片显示不出来, 在微信开发着工具上看是好好的。我一开始还以为这个是线上图片,可能是网络原因导致图片加载不出来。后面发现是本地图片, 去查了文档发现小程序不支持在 css 中使用本地文件,包括本地的背景图和字体文件, 要转换成base64格式才能正常加载。uni-app对小于40k的图片或者字体文件时, uni-app编译到不支持本地背景图的平台时,会自动将其转化为 base64 格式。
为了方便管理, 我们可以新建一个scss文件来专门放置base64格式的图片
页面中使用 : background-image: $agency-doctor-recom;
下载后解压, 这个css文件里面就是base64格式字体
使用步骤跟上面图片差不多
- 新建一个css文件, 把解压得到的css复制进去就行
- 引入并使用