2021-04-03 html文字的居中

html文字的居中

文字的水平居中：text-align:center
文字的垂直居中：设置文字的行高等于盒子的高度？？？？为什么

如图所示：行高由两部分构成：上空隙，下空隙以及文字本身的高度组成
若盒子的本身高度为40px…
行高也设置为40px…
文字的行高放到盒子里面
此时盒子的高度为40px,行高也是40px,而行高是由上空隙，下空隙和文字本身高度组成，所以可以理解成文字被挤进了盒子的中间。。。。。
如果行高比盒子的高度下的话，会怎样？

如图所示，文字垂直会偏上
同理，如果行高大于盒子高度的话，就知道文字在水平方向上会偏下了吧。。。

图片截图（黑马pink老师B站前端视频）