flex 布局的几个常用属性

 flex 布局的几个常用属性

• display 为 flex：弹性盒子
• justify-content：水平对齐方式
  • flex-start：主轴靠左对齐（默认值）
  • flex-end：主轴靠右对齐
  • center：主轴水平居中对齐
  • space-around：两端对齐，两端间距是中间距离的一半
  • space-between：两端靠边对齐，中间等距
  • space-evenly：两端对齐，两端间距与中间距离等距
• align-items 为 center ：侧轴垂直居中对齐
• flex-wrap 为 wrap, wrap 是换行，默认 nowrap 不换行
• flex-direction 为 column：主轴和侧轴换位置，名字不变
• align-self 为 center：自身侧轴垂直居中对齐（设置给弹性盒子的子元素）

 主要的demo  https://gitee.com/jiege0525_admin/flex-case.git

可以访问地址 http://1.116.177.203/  看效果