不改变外层元素CSS，实现内部元素垂直居中

.box {
  height: 200px;
  margin-top: 10px;
  border: 1px solid #CCCCCC;
}
.box_01 {
  top: 50%;
  position: relative;
  transform: translate(0, -50%);
}

<div class="box">
  <div>没有设置垂直居中</div>
</div>
<div class="box">
  <div class="box_01">设置了垂直居中</div>
</div>

显示效果如下：