本文共 1667 字,大约阅读时间需要 5 分钟。
定义 : 是由弹性容器和弹性子元素组成 display:flex;
flex-direction 属性指定了弹性子元素在父容器中的位置
语法
flex-direction : row | row-reverse | column | column-reverse
flex-direction的值有:
justify-content 属性 ---- 内容对齐属性
语法
justify-content : flex-start | flex-end | center | space-between | space-around
justify-content 的值有:
flex-start:弹性项目向行头紧挨着填充。这个是默认值
flex-end:弹性项目向行尾紧挨着填充
center:弹性项目居中紧挨着填充
space-between:弹性项目平均分布在该行上
space-around:弹性项目平均分布在该行上,两边留有一半的间隔空间
align-items 设置或检索弹性盒子元素在侧轴(纵轴)方向上的对齐方式。
语法:
align-items : flex-start | flex-end | center | baseline | stretch
align-items 属性的值有:
flex-wrap 属性用于指定弹性盒子的子元素换行方式。
语法:
flex-wrap : nowrap|wrap|wrap-reverse|initial|inherit;
flex-wrap 属性的值有 :
align-content 属性用于修改 flex-wrap 属性的行为。类似于 align-items, 但它不是设置弹性子元素的对齐,而是设置各个行的对齐。
语法 :
align-content : flex-start | flex-end | center | space-between | space-around | stretch
align-content 属性的值有:
转载地址:http://ozubf.baihongyu.com/