Box-flex属性规定框的子元素是否可伸缩其尺寸。
父元素必须要声明display:Box;子元素才可以用Box-flex。
语法:Box-flex:value;
示例:
结果: 图片
可以指定某个子元素的宽度,剩下的部分平分。
示例:
结果: 图片
Box-orient
用来确定子元素的方向,是横着还是竖着。
可选值:horizontal | vertical | inline-axis | Box-axis | inheritinline-axis是默认的 horizonta inline-axis 是一样的让元素横着 vertical
Box-axis 是一样的让元素纵列。
示例:
结果:如图
Box-direction
用来确定子元素的排列顺序。可选值:
onrmal | revers | inherit onrmal是默认值按着正常顺序排列,从左到右
从前到后,revers表示反转。
示例:
结果: 如图
Box-align与Box-pack
决定盒子内部剩余空间怎么使用,行为效果为对齐方式。
Box-align 为垂直方向上的空间利用,Box-pack 为水平方向上的空间利用。
Box-align 可选参数: start | end | center | baseline | stretch
stretch为默认父标签的高度有多高,子元素就有多高。start表示底边对齐
end 为底部对齐,center居中对齐,baseline 基线对齐。
示例: