box-pack 是 Flexbox 布局模型中的一个属性，用于指定在主轴上如何对齐弹性盒子（Flexbox）的子元素。这个属性控制子元素在主轴上的分布方式，有三个可能的值：start、end、和 center。

  •  start: 子元素沿着主轴起始边对齐。

  •  end: 子元素沿着主轴结束边对齐。

  •  center: 子元素沿着主轴居中对齐。


以下是一个简单的示例：
.container {
  display: flex;
  justify-content: space-between; /* 设置主轴上的空间分配 */
  width: 300px;
}

.item {
  width: 50px;
  height: 50px;
  background-color: lightblue;
}

.start {
  box-pack: start; /* 沿着主轴起始边对齐 */
}

.center {
  box-pack: center; /* 沿着主轴居中对齐 */
}

.end {
  box-pack: end; /* 沿着主轴结束边对齐 */
}

在这个例子中，.container 是一个 Flex 容器，内部有三个子元素，分别是.item、.start、.center 和 .end。通过设置 box-pack 属性，你可以控制这些子元素在 Flex 容器的主轴上的对齐方式。

需要注意的是，box-pack 在最新的 Flexbox 规范中已经被废弃，推荐使用 justify-content 属性来代替。上面的例子中已经使用了 justify-content 来实现类似的效果。


转载请注明出处：http://www.pingtaimeng.com/article/detail/6040/CSS