Html 垂直对齐：完整的解释

我一直在与垂直对齐做斗争，这是一个看似足够简单的过程，在不同的语言和元素类型中有很多特性。我通过stackexchange读了很多书，似乎找不到共同的理解线索

以下是我能够收集到的规则：

1） 垂直对齐在

s中不起作用，您必须设置

div{display:table cell；垂直对齐：middle}

这似乎是一个很大的麻烦，尤其是当溢出设置为隐藏并展开以适应内容时，表格单元格会覆盖高度限制，这意味着垂直“中心”是可变的

我刚刚从Pinterest中阅读了一些源代码，其中的

按钮{vertical align:middle}

，但其他

垂直对齐

命令似乎无法工作。似乎按钮默认在中间对齐。

是否有人能为

垂直对齐

属性提供清晰的解释？

哪些html元素响应垂直对齐？

哪些html元素具有默认的

vertical align

属性？

哪些html元素具有不可重写的

vertical align

属性

任何关于理解这些特质的线索都会有所帮助

提前谢谢

---

只需浏览一下链接，它会帮你一点忙，虽然没有你想要的那么多，但只是一个粗略的想法：）

对于垂直对齐，有两个选项

元素上的一个

垂直对齐适用于

inline

元素，而不是块元素。然后可以直接在元素中设置proeperty，使其与其他内联元素对齐

容器上有两个

---

您可以在容器上设置属性，就像设置

表格单元格一样。您可以将
td
上的元素垂直对齐，也可以用两个
div将其伪造，一个是
display:table
，另一个是在
display:table cell
div内，该div具有垂直对齐内容的功能。
回答得好。几个吹毛求疵的人。（i） 垂直对齐适用于
inline-level
元素，而不仅仅是
inline
元素。i、 e.它也适用于
内联块
和
内联表
元素。（ii）一般来说，您不需要display:table
div，因为浏览器无论如何都会创建一个匿名表包装器。例外情况是
display:table单元格
元素具有百分比高度。不要假设按钮不适合垂直对齐。按钮本身及其内容都与基线垂直对齐，就像任何其他内联级别元素一样。看见