box-pack
非标准：此功能是非标准的，并且不在标准轨道上。不要在面向 Web 的生产站点上使用它：它不会对每个用户都起作用。实现之间也可能存在很大的不兼容性，并且行为将来可能会发生变化。
已弃用：此功能不再推荐。尽管某些浏览器可能仍支持它，但它可能已从相关的 Web 标准中删除，可能正在被删除，或者可能仅出于兼容性目的而保留。避免使用它，并尽可能更新现有代码；请参阅本页底部的兼容性表，以指导您的决策。请注意，此功能可能随时停止工作。
警告：这是原始 CSS 弹性盒子布局模块草案的属性，已被更新的标准取代。有关当前标准的信息，请参阅flexbox。
-moz-box-pack 和 -webkit-box-pack CSS 属性指定 -moz-box 或 -webkit-box 如何在其布局方向上填充其内容。只有当框中有额外的空间时，此效果才可见。
布局方向取决于元素的方向：水平或垂直。
语法
css
/* Keyword values */
box-pack: start;
box-pack: center;
box-pack: end;
box-pack: justify;
/* Global values */
box-pack: inherit;
box-pack: initial;
box-pack: unset;
box-pack 属性指定为以下列出的关键字值之一。
值
注意
为打包目的指定的框边缘的开头取决于框的方向和方向
- 对于水平元素，开头是顶部边缘。
- 对于垂直元素，开头是左边缘。
| 正常 | 反向 | |
|---|---|---|
| 水平 | left | right |
| 垂直 | top | bottom |
与开头相对的边缘被指定为结尾。
如果使用元素的 pack 属性设置填充，则样式将被忽略。
正式定义
正式语法
box-pack = start | center | end | justify
示例
box-pack 示例
css
div.example {
border-style: solid;
display: -moz-box; /* Mozilla */
display: -webkit-box; /* WebKit */
/* Make this box taller than the children,
so there is room for the box-pack */
height: 300px;
/* Make this box wide enough to show the contents
are centered horizontally */
width: 300px;
/* Children should be oriented vertically */
-moz-box-orient: vertical; /* Mozilla */
-webkit-box-orient: vertical; /* WebKit */
/* Align children to the horizontal center of this box */
-moz-box-align: center; /* Mozilla */
-webkit-box-align: center; /* WebKit */
/* Pack children to the bottom of this box */
-moz-box-pack: end; /* Mozilla */
-webkit-box-pack: end; /* WebKit */
}
div.example p {
/* Make children narrower than their parent,
so there is room for the box-align */
width: 200px;
}
html
<div class="example">
<p>I will be second from the bottom of div.example, centered horizontally.</p>
<p>I will be on the bottom of div.example, centered horizontally.</p>
</div>
规范
不属于任何标准。
浏览器兼容性
BCD 表仅在浏览器中加载