css – 在div中垂直定位文本的方式怎么样？

我总是在div中寻找中间定位文本的替代方法,有很多方法,从 javascript动态定位到最新的css单元vw和vh.
前几天我意识到还有另外一种方式始终在我面前,但我从未使用它,即通过将div显示为表格单元格
display：table-cell; vertical-position：middle http://jsfiddle.net/manolis/TPKsf/
我还没有在生产中使用它,但我想知道使用这个解决方案的优缺点是什么.

谢谢！

解决方法

display：table-cell可能有一些你不想要的后果.通过快速搜索,我找到了一些相关信息：

> display：table-cell元素应该在display：table元素内(但是don’t necessarily need to be in a display:table-row element).
> display：table-cell元素没有边距.
>表格不会像div那样自动占据整个宽度.
> QuirksMode docs on display:table有一些有趣的信息,甚至还有一个“游乐场”,你可以轻松地改变元素的显示,看看它们是如何相互作用的.

我的看法：如果你在display：table元素中正确地形成它,并且你只需要表格格式正常的有限目的,那就去做吧(例如,将404错误垂直居中作为页面上的唯一框).

原文地址：https://www.jb51.cc/css/214933.html