Html 线条高度不小于'；垂直居中直列块

我尝试将内联块垂直居中，如下所示：

div{
宽度：50px；
高度：50px；
背景：红色；
线高：50px；
}
跨度{
显示：内联块；
宽度：20px；
高度：20px；
背景：白色；
}

因为
行高
设置文本基线的位置（span
的底端）。由于您的跨度为
20px
高，因此必须将其一半添加到
线高中
：


div{
宽度：50px；
高度：50px；
背景：红色；
线高：60px；
}
跨度{
显示：内联块；
宽度：20px；
高度：20px；
背景：白色；
}
它仍然没有居中。跨度上方有16px，下方有14px。