相对于页面，CSS 中的水平对齐很容易——margin:0 auto 可以让您在大部分时间里得到满足，而text-align:center 在其他一些情况下。
我对大师的问题不是如何垂直对齐，而是为什么要困难得多？为什么没有margin:auto 0？我的意思是，从编程的角度来看。
从理论上讲，似乎相同的算法适用于两种类型的居中。
【问题讨论】：
标签： html css theory vertical-alignment
好问题，我不知道，但我怀疑问题的根源在于 HTML，因此它的渲染引擎最初是为文档语义而不是布局/打印语义而设计的。 CSS 非常擅长描述段落、标题和各种文档问题，但在涉及到现在每个人都希望自己的网站成为的更大的 DTP 布局任务时，CSS 确实很弱。
简而言之：我认为问题在于 HTML 的任务是做一些它不打算做的事情。奎尔惊喜。
【讨论】：
vertical-align: center; 处理任何事情。请。
从概念上讲，CSS 规则按照它们在 HTML 中出现的顺序应用于文档的元素，即在 DOM 树的预遍历中。从历史上看，这是为了在加载文档时应用 CSS，但即使使用动态 HTML 和动态 CSS，一次性应用 CSS 也有性能优势。
这就是为什么 CSS 没有选择器来表示“A 后跟 B”或“A 包含 B”，而可以说“A 前面有 B”或“A 包含在 B 中” "，因为在后一种情况下，A 在前序遍历中先于 B。
垂直居中很困难，因为在处理子元素（要居中的元素）的 CSS 时，父元素和子元素的高度（计算子元素顶部偏移所需的两个值）未知，因为它们都依赖于尚未处理的元素。
绝对定位克服了对父元素高度的依赖：top: 50%。这有效地将垂直偏移的计算推迟到知道父元素的高度之后。
同样，CSS3 变换可以考虑孩子的身高：transform: translateY(-50%)。在 CSS3 之前，通常使用负数 margin-top 代替，但这需要在子元素上设置固定高度。
【讨论】：