继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

微信小程序图片使用示例

祈澈姑娘
关注TA
已关注
手记 56
粉丝 1.4万
获赞 118

##1:加载本地文件夹图片

     <image  src="/image/pig.jpg" mode="aspectFill">  
     </image>  

图片.png

##2:加载服务器图片

wxml:

    <image  src="{{imageUrl}}" mode="aspectFill">  
    </image>  

js:

Page({
  data: {
    imageUrl: "http://www.intmote.com/timg.jpg",
    
  },

图片.png

或者直接在wxml写代码:

    <image  src="http://www.intmote.com/timg.jpg" mode="aspectFill">  
    </image>  

图片.png

###3:给小程序页面加载一张背景图片
方法一:
使用背景图片的时候用网络图片,就是用外链的形式,比如你将这张图片放到你的服务器,如:https://xxxx/xxx.jpg

方法二:
将背景图片使用编码base64进行转换,可以在这个网址进行http://tool.css-js.com/base64.html 转换,如:background-image: url(“转换后得到的编码文本”),如果多次使用的话可以将该值设置为全局变量,再在js文件进行引用即可;

打开App,阅读手记
2人推荐
发表评论
随时随地看视频慕课网APP

热门评论

这个也值得写手记? excuse me ?

挺好的。看文档比较枯燥

这个?有难度? 文档不是有吗

查看全部评论