-
核心点
使用了FFC/GFC 使 margin: auto 在垂直方向上居中元素。 -
原因如下:
在弹性项目上的自动边距的效果与块流中的自动边距非常相似:
1、在计算弹性基数和弹性长度时,自动边距被视为 0;
2、在通过 justify-content 和 align-self 进行对齐之前,任何正的可用空间都会分配到该维度中的自动边距。
3、溢出的盒子会忽略它们的自动边距并在末端方向溢出。注意:如果可用空间分配给自动边距,则对齐属性将在该尺寸中不起作用,因为边距将窃取弯曲后剩余的所有可用空间。
-
重点
margin auto 的生效不仅仅是方向,垂直方向同样水平自动去分配这个剩余空间。
例如
html:
<div class="container">