我一直在为垂直对齐而苦苦挣扎,这是一个看似足够简单的过程,但在不同的语言和元素类型中有很多特质。我已经通过 stackexchange 进行了大量阅读,但似乎无法找到共同的理解思路。
以下是我能够收集到的规则:
1) 垂直对齐在 <\div>
中不起作用s,你必须设置div {display: table-cell; vertical-align: middle}
这看起来很麻烦,尤其是因为表格单元格会覆盖高度限制,即使溢出设置为隐藏并扩展以适合内容,这意味着垂直“中心”是可变的。
我刚刚从 Pinterest 阅读了一些源代码,其中 button {vertical-align: middle}
,但没有其他 vertical-align
命令似乎有效。按钮似乎默认居中对齐。
有人可以为 vertical-align
提供一个明确的解释吗?属性?
vertical-align
?
vertical-align
属性?
vertical-align
属性?
任何关于理解特质的线索也会有所帮助!
提前致谢!
最佳答案
垂直对齐有两个选项
一个在元素上。
Vertical-align 适用于 inline
元素而不是 block 元素。然后可以直接在元素中设置proeperty与其他内联元素对齐。
两个在容器上
您可以像 table-cell
一样在容器上设置属性。您可以垂直对齐 td
上的元素,或者用两个 div
伪造它,一个带有 display:table
并在 display 内: table-cell
垂直对齐内容的 div。
关于html - 垂直对齐 : A Full Explanation,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19639093/