css – justify-content vs align-items之间的区别？

参见英文答案 > In CSS Flexbox,why are there no “justify-items” and “justify-self” properties?5个
我很难理解有什么区别？从我的研究看起来似乎是合理的 – 内容可以做到……空间和空间,而对齐项目可以做…拉伸,基线,初始和继承？

也看起来像属性共享,flex-start,flex-end和center.

使用一个而不是另一个或者它只是偏好吗？我觉得他们是相似的,只是做同样的事情,谁知道差异？谢谢！！

解决方法

注意：

如果使用flex-direction：行或列,则X轴和Y轴/对齐方向可能会发生变化

1. justify-content：水平

对齐&沿主轴间距(X轴)

FLEX-启动;将孩子水平对齐

柔性端;将孩子水平对齐

中央;将孩子水平居中对齐(惊奇！)

空间之间;在整个宽度上均匀地分布儿童

空间的周围;在整个宽度上均匀地分布儿童(但边缘上有空格)

2. align-items：垂直

仅沿辅助轴(Y轴)对齐

FLEX-启动;将孩子垂直对齐顶部

柔性端;将孩子垂直对齐

中央;将孩子垂直居中对齐(惊奇！)

基线;垂直对齐儿童,使他们的基线对齐(不起作用)

伸展;强迫孩子成为容器的高度(非常适合列)

看到它在行动：

http://codepen.io/enxaneta/full/adLPwv/

我的想法是：

这些应该被命名为：

flex-x：左或右或中心或拉伸或间隔或空间

flex-y：向左或向右或中心或伸展

但是使用html,你永远不会有好东西.决不.