Flex justify-content属性

CSS3 justify-content属性用于定义沿主轴的对齐方式。它是CSS3 Flexbox布局模块的子属性。

当项目不使用主轴上所有可用空间时，它将水平设置Flexbox容器的项目。

其可能的值为：

• flex-start：默认值。它将项目设置在容器的开头
• flex-end：将项目设置在容器的末尾。
• 中心：将项目设置在容器的中心。
• space-between：设置项目之间的行距。
• space-around：在行之前，行之间和行之后设置空格。

让我们举个例子。

请参阅以下示例：

示例1 ：(使用Flex-end值)

  
flex item 1
  
flex item 2
  
flex item 3

示例2 ：(使用中心值)

  
flex item 1
  
flex item 2
  
flex item 3

示例3 ：(使用空格之间的值)

  
flex item 1
  
flex item 2
  
flex item 3

示例4 ：(使用空格值)

  
flex item 1
  
flex item 2
  
flex item 3