# 微信小程序开发之-基本UI

广告

欢迎大家一起交流 QQ群 转战小程序 132762067 公众号

我是jpg

1. view

   属性如下：

image.png

wxml

wxss

.jx_card{
    width: 100%;
    height: 250rpx;
    background-color:#f3f3f3;
    position: relative
}

调试面板

image.png

2. image

属性：

image.png

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

mode 有效值：

mode 有 13 种模式，其中 4 种是缩放模式，9 种是裁剪模式。

image.png

image.png

具体样式可查看 官方文档

• 展示本地图片（类似于[UIImage imageNamed:icon_imageName]）

• 展示网络图片

还可以调用js中得url连接

js中数据

data:{  
    imageUrl:"http://otoxzxreo.bkt.clouddn.com/icon_home_nearby.png""  
},  

调试面板

image.png

广告

欢迎大家一起交流 QQ群 转战小程序 132762067 公众号

我是jpg