块状容器内利用vertical-align垂直中心对齐

尽管before的content设置为空字符串，但是产生空格（相对于两个行内元素换行浏览器自动添加空格）

CSS 的属性 vertical-align 指定了行内（inline）元素或表格单元格（table-cell）元素的垂直对齐方式。

既然是指定行内元素的垂直对齐方式，那必须要有“行”。

所以自己创建“行”——利用容器的::after/::before伪元素（CSS伪元素::after用来匹配已选中元素的一个虚拟的最后子元素）的display属性，将其设置为inline-block（这样才能设置高度）即可，另外设置height属性值为100%来让其作为容器子元素的实际意义上的“容器”。由于vertical-align的初始值是“baseline”，所以还需将vertical-align手动设置为middle。

接下来将容器内的子元素作为行内元素垂直中心对齐“行”，只需将display设置为inline-block和vertical-align设置为middle即可;

ex:

.dialog_container {      display: block;      width: 100vw;      height: 100vh;      background-color: rgba(0,0,0,.35);      text-align: center;      position: fixed;      top: 0;      left: 0; } .dialog_container:before {      display: inline-block;      content: ''%3B      height: 100%;      vertical-align: middle; } .dialog_box {      display: inline-block;      vertical-align: middle; }