• flex取值


    flex:

    (主轴方向)flex-direction:取值1,row(水平向右),2,row-reverse(水平向左),3,column(垂直向下),4,column-reverse(垂直向上)。

    (主轴对齐方式)justify-content:取值1,flex-start(向主轴开始的方向对齐),2,flex-end(向主轴结束的方向对齐),3,center(居中对齐),4,space-around(让空白环绕盒子显示,1盒子2盒子2盒子1),5,space-between(让空白只在盒子中间显示,0盒子1盒子1盒子0)。

    (单行侧轴对齐方式)align-items:取值1,flex-start(向侧轴开始的方向对齐),2,flex-end(向侧轴结束的方向对齐),3,center(居中对齐),4,stretch(默认值,让盒子的高度拉伸显示,如果需要拉伸显示,不能给子元素设置高度。)。

    (设置是否换行)flex-wrap:取值1,nowrap(不换行),2wrap(当子元素一行放不下就换行)。设置换行后,盒子就被分为二行,每行都是在顶部显示。

    (多行侧轴对齐方式)align-content:取值1,flex-start(向侧轴开始的方向对齐),2,flex-end(向侧轴结束的方向对齐),3,center(居中对齐),4,stretch(默认值,让盒子的高度拉伸显示,如果需要拉伸显示,不能给子元素设置高度。),5,space-around(让空白上下环绕盒子显示),6,space-between(让空白只在盒子中间显示,顶部和底部没有空白,中间有)。

  • 相关阅读:
    js delete 操作符
    js中contains()方法的了解
    绝对地址、相对地址、/、./、../之间的区别
    关于应用版本号的更迭
    js事件的绑定与移除
    js实现阶乘
    圆角和渐变
    css3用到知识点小结
    font-size:0的妙用,用于解决inline或者inline-block造成的间隙
    js怎么把数字转化为字母(A,B.....AA,AB,..)
  • 原文地址:https://www.cnblogs.com/xiaoxiao95/p/13194033.html
Copyright © 2020-2023  润新知