微信小程序view组件

微信小程序view组件view组件类似于HTML中的div标签是最基础的UI组件,一般使用view来进行页面内容的区块划分。view组件本身没有任何样式,全部需要通过css来手动定义。view示例代码如下:

<!--index.wxml-->
<view class='red'>
  <view class='green'>green</view>
  <view class='blue'>blue</view>
</view>
<view class='orange'></view>
/**index.wxss**/
/* class='red'样式 */
.red{
  width: 100%;
  /* height: 100px; */
  background-color: red;
}
/* class='green'样式 */
.green{
  width: 100px;
  height: 100px;
  background-color: green;
}
/* class='blue'样式 */
.blue{
  width: 100px;
  height: 100px;
  background-color: blue;
}
/* class='orange'样式 */
.orange{
  width: 100%;
  height: 100px;
  background-color: orange;
}

效果如图所示。
微信小程序view组件

view组件的属性如表所示。
微信小程序view组件

其中“hover-start-time”“hover-stay-time”是为了满足长按触发的条件,“hover-class”可以帮助用户区分是否进行了单击操作。

注意:类型为number的只需要填写数值即可。数值需要写在引号中。

酷客网相关文章:

赞(0)

评论 抢沙发

评论前必须登录!