详细说明：justify-content: flex-start/end

参考资料

1. css div居中对齐方式
2. 属性选择器详细说明以及案例
3. 背景属性详细说明以及案例
4. Flex布局在动画制作中的应用？
5. css中设置div居中
6. display: flex/inline-flex示例
7. flex-direction: row/column示例
8. CSS有哪些预处理器？

justify-content: flex-start  

• 作用：将子元素对齐到容器起始位置（左/上）。

• 示例：  

  .container {
    display: flex;
    justify-content: flex-start;
  }

  <div class="container">
    <div>Item 1</div>
    <div>Item 2</div>
  </div>

  效果：子元素紧贴容器左侧（默认方向）。

justify-content: flex-end  

• 作用：将子元素对齐到容器末尾位置（右/下）。

• 示例：  

  .container {
    display: flex;
    justify-content: flex-end;
  }

  <div class="container">
    <div>Item 1</div>
    <div>Item 2</div>
  </div>

  效果：子元素紧贴容器右侧。

注意：需配合display: flex使用，方向受flex-direction影响（如column时对齐顶部/底部）。