div内容上下居中

今天无聊闲逛技术群，听一哥们说要在div里面居中span内容。

第一印象：vertical-align: middle;

结果失效。百度一下是因为 vertical-align 只对一些特定的样式生效，例如：图片，单元格显示（table-cell）

故此代码修改如下：

div{
    width: 200px;
    height: 50px;
    border: 1px solid;
    display: table-cell;
    vertical-align: middle;
}

把div渲染成表格形式，类似于 td 这种

就可以居中了。

　　By~