【小程序开发教程系列8】入门篇之小程序组件——媒体组件

春哥技术团队虎子关于小程序开发教程继续更新中,上一篇文章讲解了“小程序组件 - 导航”,本篇文章讲解“小程序组件 - 媒体组件”。

1. image——图片

1)image标签的使用

①展示一张图片,图片可选网络图片

小程序入门连载八」小程序组件—媒体组件

②编译预览

小程序入门连载八」小程序组件—媒体组件

2)属性——mode

mode属性,图片剪裁、缩放模式。

小程序入门连载八」小程序组件—媒体组件

注意:

1. image组件默认宽度300px、高度225px。

2. mode有13种模式,其中4种是缩放模式,9种是裁剪模式

①scaleToFill

依旧使用test页面,test.wxml文件:

小程序入门连载八」小程序组件—媒体组件

test.wxss文件:

小程序入门连载八」小程序组件—媒体组件

编译预览:

小程序入门连载八」小程序组件—媒体组件

scaleToFill是将图片拉伸至填满整个image,图片会变形。

②widthFix(与我们在HTML中使用的比例相同)

小程序入门连载八」小程序组件—媒体组件

编译预览:

小程序入门连载八」小程序组件—媒体组件

春哥团队独家打造的春哥小程序开发平台V1.1源码系统已经正式发布了,用此款源码系统可以分分钟搭建出强大的小程序开发平台,无需编程,小白也可以开发小程序,轻轻松松接单赚钱

 
来源:春哥技术博客,欢迎分享,(春哥微信号:cgnanyin)
上一篇:【小程序开发教程系列7】入门篇之小程      下一篇:【小程序开发教程系列9】入门篇之小程