一、定义
Flex为“弹性布局”,任何一个容器都可以指定Flex布局
1 .box{
display:flex;
}
2 行内元素:
.box{
display:inline-flex;
}
3 Webkit 内核的浏览器,必须加上 -webkit 前缀
.box{
display:-webkit-flex;
}
二、基本概念:
1.Flex容器:flex container(容器)---> Flex项目:flex item(项目)
2.容器默认存在两根轴:水平的主轴:开始位置:main start , 结束位置:main end
垂直的交叉轴: 开始位置:cross start , 结束位置:cross end
3.项目默认沿主轴排列,单个项目占据的主轴空间叫做:main size
单个项目占据的交叉轴空间叫做:cross size

网友评论