• flex-direction
• flex-wrap
• flex-flow
• justify-content
• align-items
• align-content

flex-wrap属性

justify-content属性

• flex-start（默认值）：左对齐
• flex-end：右对齐
• center： 居中
• space-between：两端对齐，项目之间的间隔都相等。
• space-around：每个项目两侧的间隔相等。所以，项目之间的间隔比项目与边框的间隔大一倍。

align-items属性

• flex-start：交叉轴的起点对齐。
• flex-end：交叉轴的终点对齐。
• center：交叉轴的中点对齐。
• baseline: 项目的第一行文字的基线对齐。
• stretch（默认值）：如果项目未设置高度或设为auto，将占满整个容器的高度。

align-content属性

• flex-start：与交叉轴的起点对齐。
• flex-end：与交叉轴的终点对齐。
• center：与交叉轴的中点对齐。
• space-between：与交叉轴两端对齐，轴线之间的间隔平均分布。
• space-around：每根轴线两侧的间隔都相等。所以，轴线之间的间隔比轴线与边框的间隔大一倍。
• stretch（默认值）：轴线占满整个交叉轴。

 项目的属性

• order
• flex-grow
• flex-shrink
• flex-basis
• flex
• align-self

 flex-grow属性

flex-shrink属性

flex-basis属性

flex属性

align-self属性

Page({

  /**
   * 页面的初始数据
   */
  data: {
    
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {
    
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {
    
  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {
    
  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {
    
  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {
    
  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {
    
  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {
    
  }
})

 page()是在小程序上注册一个页面。详情如官方文档。

wx-gesture-lock  微信小程序的手势密码

WXCustomSwitch 微信小程序自定义 Switch 组件模板

WeixinAppBdNovel 微信小程序demo：百度小说搜索

shitoujiandaobu 小程序：石头剪刀布（附代码说明）

audiodemo 微信小程序开发之视频播放器 Video 弹幕 弹幕颜色自定义

star 微信小程序开发之五星评分

switchCity 微信小程序开发之城市选择器 城市切换

huadong_del  微信小程序滑动删除效果

jianhang_menu 微信小程序开发之圆形菜单 仿建行圆形菜单

xiaoxiaoxiao_lazyload  实现微信小程序图片懒加载特效

kangaiduowei  微信小程序：康爱多微商城：学习界面设计

tianmao_dazhuanpan  小程序实现大转盘 仿天猫抽奖 跑马灯效果（有图有源码）

weapp-meirong  微信小程序学习用demo推荐：美容商城；列表，预约

baisi  微信小程序仿百思不得姐

weapp-one 仿 「ONE · 一个」 的微信小程序

netmusic-app  仿网易云音乐APP的微信小程序

a_takeaway  微信小程序的外卖demo

sideslip  微信小程序『侧边栏滑动』特效

wx_plo  微信小程序之仿微信漂流瓶

kwonWhere 微信小程序-知亦行

audiodemo  微信小程序开发之视频播放 弹幕 弹幕颜色自定义

wxChart  微信小程序图标插件

guoku  微信小程序-果库

snake  微信小程序-贪吃蛇小程序

douban_movie  微信小程序-仿豆瓣电影

RecordDemo  麦克风动画

shishanggou  实现了包括常用组件，ajax获取数据，模板使用，路由等的使用，下拉刷新数据；

jiajuzaixian  家具在线-演示如何使用下拉选项

wechat-app-ipinbb  爱拼宝宝-功能非常全的电商应用

TodayNews-wx  微信小程序-今日头条

WXNative-bpgg  奔跑果果-微信小程序

wechatapp-demo   是目前我发现的，实现实用功能较多的demo，推荐大家学习研究

weapp-MatterAssistant  微信小程序－事项助手

weapp-wymusic  微信小程序 仿网易云音乐

weapp-wechat-nearby  微信小程序-仿找事吧app附近三公里

bs  精简版百思不得姐

WXBaiSi  微信小程序版 百思不得姐

weapp-demo-breadtrip  基于面包旅行 API 制作的微信小程序示例

html-to-wxml  小程序中将html内容转化成wxml可以显示的内容，方便用于小程序中显示

kachezhijia  自卡车之家，有丰富的卡车司机和物流园区的资源，所以这个小程序可以说也是他们未来工作上的一个必将实施的项目。

WxEmojiView   微信小程序Emoji展示输入组件alpha 0.1

GankCamp-WechatAPP gank.io (干货集中营) 微信小程序 版本

wechat-JD  微信小程序仿京东首页

wechat-turntalbe-canvas  用微信小程序开发的Canvas绘制可配置的转盘抽奖。

mangguoTv  微信小应用-小程序-demo-仿芒果TV

wxreading  微信小程序跟读

WeChatMeiZhi  微信小程序版妹纸图 API from gank.io

CountDown  微信小程序倒计时组件

weapp-github  微信小程序--github

wechat-weapp-mapdemo  微信小程序开发demo-地图定位，非常简单的demo，只为了解一下微信小程序

wechat-cnode  微信小程序 cnode社区版

weapp-newsapp  微信小程序-公众号热门文章信息流

wechat-weapp-taobao  微信小程序demo 仿手机淘宝

timer  番茄时钟微信小程序版

wechat-app-music  微信小程序：音乐播放器 技术栈: redux + es7 +labrador

fenda-mock  使用微信小程序实现「分答」这款APP的基础功能

Wa-UI  针对微信小程序整合的一套UI库

wx-query  微信小程序 仿jQuery插件

weapp-artand  微信小程序 Artand

WeiXin-SmallApps-Information  微信小程序-仿今日头条

weapp-wechat-zhihu  微信中的知乎--微信小程序

WeApp  基于微信小程序开发的仿微信demo

SmallApp  微信小程序

wechat-v2ex 微信小程序-v2ex

weipiao 微信小程序-微票

DouBanBookApp   微信小程序之小豆瓣图书

wxapp-calc 一个简单的微信小程序-简易计算器

weapp-wechat-zhihu   模仿知乎的小程序

wx-movies-demo   小程序--影讯

caiquan  微信小应用，猜拳小游戏

hayeah-wxapp-Breakfast  小林早厨微信小程序

AppleMusic  微信小程序，仿Apple Music

cnode_wechat-webapp 用cnode社区api做的微信小应用

shoppingcar 一个点餐、购物的购物车效果

wechat-weapp-mall 微信小程序实现移动端商城

SmallAppForQQ  高仿手机QQ应用程序

zhihudaily  微信小程序-知乎日报

wechat-weapp-gank 微信小程序-干货投稿应用

TeamToy  调用TeamToy API 的微信小程序 Demo

douban 微信小程序（应用号）示例教程（豆瓣电影）