码迷,mamicode.com
首页 > 其他好文 > 详细

flexbox布局

时间:2016-05-10 18:09:58      阅读:119      评论:0      收藏:0      [点我收藏+]

标签:

毁了三个属性:float clear vertical-align

容器的六个属性

  1. flex-direction:主轴方向
  2. flex-wrap 不换行 上下换行
  3. flex-flow相当于flex-directin+flex-warp的简写
  4. justify -content 单行水平布局 左对齐 右对齐 中间对齐 两端对齐 等间隔对齐  可实现水平居中
技术分享
5.align-items 单行多个垂直布局  上对齐 下对齐 中心对齐 伸展对齐 基线对齐  可实现垂直居中
技术分享
6.align-content 多行间距布局
技术分享
内部项目的属性:
  • order
  • flex-grow
  • flex-shrink
  • flex-basis
  • flex  相当于flex-grow flex-shrink flex-basis 三个的和
  • align-self




flexbox布局

标签:

原文地址:http://www.cnblogs.com/laiqun/p/5478455.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!