首页 > 微信 > 详细

小程序开发全栈1.2/3/4组件、flex布局、样式

时间:2020-07-18 11:12:11      阅读:62      评论:0      收藏:0      [点我收藏+]

1.2 组件

1.2.1 text组件

编写文本信息,类似于HTTP中的span

1.2.2 view组件

容器,类似于HTTP中的div

1.2.3 image组件

图片显示组件

1.3 页面flex布局

一种非常方便的通用布局方式

1.3.1 flex-direction

规定主轴方向

  • column:主轴竖直

  • row:主轴水平

1.3.2 justify-content

规定主轴方向上的排列方式

  • flex-start/end

  • center

  • space-around

  • space-between

1.3.3 align-items

规定副轴方向排列方式

  • flex-start/end
  • center
  • space-around
  • space-between

1.3.4 示例:

display:flex;					flex布局
flex-direction:row;				规定主轴方向:row/column
justify-content:space-around;	元素在主轴方向上的排列方式:flex-start/end/space-around/space-between
align-items:center;				元素在副轴方向上的排列方式

1.4 样式

1.4.1 像素

  • px:像素点
  • rpx:像素,针对不同的设备自动适配,保证小程序前端兼容性
    • 规定设备的最大宽度为750rpx;

小程序开发全栈1.2/3/4组件、flex布局、样式

原文:https://www.cnblogs.com/fyfandhmx/p/13334638.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!