通过使用 box-align(垂直) and box-pack(水平) 属性,居中 div 框的子元素:
(1)这样可以很简单的模拟对话框水平居中效果一:
1、目前没有浏览器支持box-align属性
2、firefox支持替代的-moz-box-align属性
3、safari opera 以及chrome支持替代的-webkit-box-align属性
(2)语法:box-align: start|end|center|baseline|stretch;
start:对于正常方向的框,每个子元素的上边缘沿着框的顶边放置。
对于反方向的框,每个子元素的下边缘沿着框的底边放置。
end:对于正常方向的框,每个子元素的下边缘沿着框的底边放置。
对于反方向的框,每个子元素的上边缘沿着框的顶边放置。
center:均等地分割多余的空间,一半位于子元素之上,另一半位于子元素之下。
baseline:如果 box-orient 是inline-axis或horizontal,所有子元素均与其基线对齐。
stretch:拉伸子元素以填充包含块

本文介绍如何使用box-align和box-pack属性实现div框内元素的居中显示。包括不同浏览器对这些属性的支持情况及替代方案,并解释了start、end、center等取值的具体含义。
285

被折叠的 条评论
为什么被折叠?



