justify-content：空间之间的解释（CSS）
直观地构建 CSS Flexbox 布局：flex-direction、justify-content、align-items、flex-wrap 和容器上的间隙，以及每个子项的 flex-grow、flex-shrink 和 flex-basis，所有这些都具有实时预览和可复制的 CSS。
处理中...
0%
结果
此页面打开生成器，并将 justify-content 设置为 space- Between ：第一个框与容器的起始边缘齐平，最后一个框与其结束边缘齐平，剩余空间被划分为中间框之间的相等间隙 - 永远不会在第一个框之前或最后一个框之后。
这就是人们混淆的细节。 space-around 为每个框的两侧提供了相等的边距，因此框之间的间隙最终是两个外边缘间隙的两倍（每个边缘仅获得一个框的边距，而不是两个）。 space-evenly 更进一步，使每个间隙大小相同，包括两个外边缘——三个间隙中唯一一个间隙看起来完全均匀。
在下面的三个值之间切换 justify-content 下拉列表，并观察相同的三个框重新排列 - 这是查看差异而不是记住差异的最快方法。复制 CSS，找到与您实际想要的间距相匹配的 CSS。