块级、绝对定位和表格布局的盒子对齐

该盒子对齐规范详细说明了各种布局方法中的对齐方式。在本页中，我们将探讨盒子对齐在块级布局上下文中的工作原理，包括浮动、定位和表格元素。由于本页旨在详细说明块级布局和盒子对齐的特定内容，因此应结合主盒子对齐页面一起阅读，该页面详细说明了跨布局方法的盒子对齐的共同特性。

align-content 和 justify-content

该justify-content属性不适用于块级容器或表格单元格。

该align-content属性应用于块轴，以便在容器内对齐盒子的内容。如果请求了诸如space-between、space-around或space-evenly之类的内容分布方法，则将使用回退对齐，因为内容被视为单个对齐主体。

该justify-self属性用于在内联轴上对齐其包含块内的项目。

此属性不适用于浮动元素或表格单元格。

该align-self属性不适用于块级盒子（包括浮动），因为块轴中存在多个项目。它也不适用于表格单元格。

对齐容器是定位的块，考虑了顶部、左侧、底部和右侧的偏移值。normal 关键字解析为stretch，除非定位的项目是替换元素，在这种情况下它解析为start。

由于我们目前没有浏览器支持块级布局中的盒子对齐，因此您的对齐选项要么使用现有的对齐方法之一，要么将容器内的单个项目设为 Flex 项目以使用 Flexbox 中指定的对齐属性。

在 Flexbox 之前，块水平对齐通常是通过在块上设置自动边距来实现的。一个margin的auto将吸收该维度中的所有可用空间，因此设置左侧和右侧边距为 auto，您可以将一个块推到中心

css

.container {
  width: 20em;
  margin-left: auto;
  margin-right: auto;
}

在表格布局中，您可以访问vertical-align属性以对齐单元格内单元格的内容。

对于许多用例，将块容器转换为 Flex 项目将为您提供所需的对齐功能。在下面的示例中，包含单个项目的容器已转换为 Flex 容器，以便能够使用对齐属性。