弹性布局
display ：fixed
弹性布局的特点：
1.优点：可以解决复杂的布局问题 缺点IE不兼容
弹性布局
- 改变是父容器的布局方式；有默认的流式布局为弹性布局
- 简介改版子元素属性；块变为行内块
主轴：默认为盒子水平方形；可以通过改变方向主轴方向
交叉轴：与主轴垂直及时交叉轴
总结：
1.弹性布局改变的容器内容的布局方式；从流式布局变为flex布局
2.布局方式的规律是什么呢？
沿着主轴起始方向排列，在主轴方向上有不同的对齐方式
主轴方向：水平方向，垂直方向
起点：有正（左 or 上） 反（右 or 下）
对齐方式：左对齐，右对齐，居中对齐，两端对齐，等距离对齐（子元素距离相等）
注意：如果子元素宽度或者高度之和 大于父元素；布局之后，是否换行
当容器的流发生改变时 ；子元素也会受影响；有块变行内块
竖直方向弹性布局
注意：我们所接触的所有布局；视觉角度- 都是横向的。所有纵向会很抽象
方式：1.横向布局；我们只要考虑左右方向就可以了
2.纵向布局都需要看的是 页面的上下。
align-item
- 作用：决定子元素在交叉轴排列方式
- flex-start 从交叉轴起始位置开始排列；
- 如果交叉轴方向在纵向，那么就是从上面开始排列
- flex-end 从交叉轴末端开始排列
- center 从容器的中间开始；
- 如果交叉轴方向在竖直方向；那么center 那是从父容器高度中间开始排列
- baseline 与子元素中的文字有关；所有子元素中；第一行文字对齐 ， 也就是；根据每个子元素中；
每一行文字的位置；决定每个字元素的对齐 - stetch 默认值
标签：元素,主轴,布局,999,弹性,方向,对齐 来源： https://blog.csdn.net/xyf239068970/article/details/99053533
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。