尽管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: '';
height: 100%;
vertical-align: middle;
}
.dialog_box {
display: inline-block;
vertical-align: middle;
}