CSS flex-box
因为CSS的flex每次用的时候总是忘记, 这儿总结一下:
将flex理解为一个画框(父元素)里面的元素(子元素)的排列.
父元素设置整体遵从的规则, 子元素设置个别规则.
总体规格包括:
- flex-direction: 确定主轴方向. 元素是沿着主轴方向依次放置的. 交叉轴(副轴)即主轴的垂直轴, 确定一行主轴放不下的元素,下一行放的方向.
- flex-wrap: 元素在主轴放不下, 要不要回车放在下一行.
- justify-content: 确定元素主轴排列, 以及元素间距
- align-items: 确定副轴的元素排列
- align-content: 确定wrap后多行的元素怎么放置,以及行间距等.