2018-03-01-2再学组件

view组件
官网给的代码其实不能跑起来的，其实必须修改WXML文件与添加WXSS文件，最后我将自己写的代码贴出来

  flex-direction: row
  
    1
    2
    3
  


  flex-direction: column
  
    1
    2
    3
  

/* pages/component/view.wxss */
.section{
  flex-direction: row
}
.section__title{
  flex-direction: row
}
.flex-wrp{
  flex-direction: row
}
.flex-item {
  width: 100rpx;
  height: 100rpx;
}
.bc_green{
  background: greenyellow;
  text-align:center;
}
.bc_red{
  background: red;
  text-align: center;
}
.bc_blue{
  background: blueviolet;
  text-align: center;
}

注意：
1.布局不加这行代码display:flex; 是无法显示水平布局的
2.设置宽高，rpx的单位不能丢失，丢失了宽高的设置无效。
3.选择器（.flex-item）设置整体，而选择器（.bc_green）设置局部的WXSS显示样式