行高是baseline之间的距离。类似英语笔记本子的第3跟线和下一行第3跟线的距离， 行高和字体大小的差值的一半放在文本字体的上下。这样 当行高和盒子一样的时候单行文本就真好居中了

我的理解：

• 由于line-height指的是行高；

• 而这个行高在CSS里可理解为：包含文字在内以及上和下两部分空白的值。

• 由于你的高度是40px；所以要想文字在中间，那么你的行高也设置为40px，那样你的文字就在该行的中间了。

原来a块中的height值是30px；后来的a .on, a:hover中设置了height为40px；所以需要重新设置line-height值。