flex弹性盒子常用属性

来源:互联网 发布:淘宝打折怎么设置 编辑:程序博客网 时间:2024/06/05 15:12

flex弹性盒子常用属性

属性值描述displayflex定义一个盒子为弹性盒子flex-directionrow子盒子水平排列,从左到右row-reserve子盒子水平反向排列column子盒子垂直排列,从上到下column-reserve子盒子垂直反向排列flex-wrapno-wrap子盒子不换行,默认wrap子盒子不换行wrap-reverse换行并改变顺序justify-contentflex-startflex子元素在最左边flex-endflex子元素在最右边centerflex子元素在正中间space-between平分flex容器space-around平分flex容器,但是每个子元素两边是子元素间距的一半align-contentflex-startflex子元素在最上边flex-endflex子元素在最下边centerflex子元素在纵向正中间space-between纵向平分flex容器space-around纵向平分flex容器,但是每个子元素两边是子元素间距的一半stretch默认:li将ul划分align-itemsflex-startflex子元素在最上边flex-endflex子元素在最下边centerflex子元素在纵向正中间baseline如弹性盒子元素的行内轴与侧轴为同一条,则该值与'flex-start'等效。其它情况下,该值将参与基线对齐stretch高度100%,宽度自动align-selfflex-startflex子元素在最上边flex-endflex子元素在最下边centerflex子元素在纵向正中间baseline如弹性盒子元素的行内轴与侧轴为同一条,则该值与'flex-start'等效。其它情况下,该值将参与基线对齐stretch高度100%,宽度自动order1(number)改变顺序flex1(number)该元素占子元素剩余位置的比例
原创粉丝点击