display的table和table-cell一般情况下用的不多，所以很少有人去关注它，但他们两个联手起来会给你惊喜！
这里抛出这样一个问题，如下，让块里的多行文字垂直居中？一说到垂直居中就会想到，单行文字垂直居中line-height等于height；块级元素垂直居中，position定位或者flex布局。但这里我介绍display：table和table-cell是如何让多行文字垂直居中的。虽然感觉用的不多，但是在某些时候还是挺管用的，
效果如下图：
具体代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>地图</title>
<style>
.section-table{
display: table;
height: 400px;
background: #f90;
}
.text-center{
display: table-cell;
vertical-align: middle;
}
</style>
</head>
<body>
<div class="section-table">
<div class="text-center">
<h3 style="padding:10px 20px;">科技生活</h3>
<p style=" margin-bottom: 30px;font-size: 16px;padding:0 20px;line-height: 24px;">DJI 带屏遥控器配备新一代 OcuSync 2.0 高清图传系统，可以适配“御”Mavic 2 等采用 OcuSync 2.0 高清图传系统的飞行器<sup>[1]</sup>。
拥有 5.8GHz 和 2.4GHz 两个通信频段，系统可以根据环境干扰情况的不同在 2.4GHz 与 5.8GHz 双频段之间自动选频和切换，有效降低环境干扰对飞行操控和图像画质的影响，并带来远达 8 公里<sup>[2]</sup>的图传距离。</p>
</div>
</div>
</body>
</html>