css - css中box-pack和box-align的区别

Question

任何人请指出 box-align 和 box-pack 之间的区别

以下是我的代码。它适用于 box-align 和 box-pack。


    div
    {
   width:100px;
   height:100px;
   background:orange;
   display:-webkit-box;
   -webkit-box-align:start;
    }

score 2 · Accepted Answer

指定当前元素内的子元素在方向方向上的对齐方式。

对于子元素水平对齐的元素，包装值 start 表示左对齐，右侧有额外空间，end 值表示右对齐，左侧有额外空间，center 值表示中心对齐，额外空间均匀分割justify 值表示外部元素应该左右对齐，元素之间均匀添加空间。

句法

-webkit-box-pack: <alignment>;

价值观：

<alignment> 子元素的对齐方式。

center：子元素对齐到元素的中心。

end：子元素对齐到元素的末尾。

justify：子元素与元素的开始和结束都对齐。

start：子元素与元素的开头对齐。

指定外部灵活框元素内嵌套元素的对齐方式。

如果盒子方向是垂直的，则此属性指定水平对齐方式，反之亦然。此属性仅适用于灵活的框布局。有关灵活框的更多信息，请参阅http://www.w3.org/TR/css3-layout/。

句法

-webkit-box-align: baseline | center | end | start | stretch;

价值观：

基线：元素与框的基线对齐。

center：元素与框的中心对齐。

end：元素与框的末端对齐。

start：元素与框的开头对齐。

拉伸：元素被拉伸以填充框。

score 0 · Accepted Answer

BOX-PACK用于水平包装内容物。box-pack 的值是

开始- 向左对齐，并在右侧留下任何空间。

中心- 对齐中心，在两侧平均划分空间。

结束- 右对齐...

Justify - 在子元素之间平均分配空间。

BOX ALIGN用于简单的垂直调整。

框对齐：开始 | 中心 | 结束 | 基线 | 拉伸 /* 指定 */

2 回答 2