弹性盒模型(一)

弹性盒模型的父级元素必须要加display:box或者display:inline-box

  • box-orient 定义盒模型的布局方向

    horizontal 水平显示
    vertical 垂直显示
    
  • box-direction 元素排列顺序

    normal 正序
    reverse 反序
    
  • box-ordinal-group 设置元素的具体位置

     最小值默认为1
    
  • box-flex 弹性空间管理

    子元素的尺寸 = 盒子的尺寸 * 子元素的 box-flex属性值 / 所有子元素的 box-flex属性值的和。
    
  • box-pack 对盒子富裕空间进行管理

    start 所有子元素在盒子的左侧显示,富裕空间在右侧
    end 所有子元素在盒子的右侧显示,富裕空间在左侧
    center 所有子元素居中显示
    justify 富裕空间在所有子元素之间平均分布
    
  • box-align 对盒子垂直方向富裕空间的管理

    start 所有子元素在顶部显示
    end 所有子元素在底部显示
    center 所有子元素居中显示
    
  • column-width

     栏目宽度
    
  • column-count

      栏目列数
    
  • column-gap

     栏目距离
    
  • column-rule

    栏目间隔线
    

你可能感兴趣的:(HTML/CSS)