我对以下的文字 透过CSS设定字型：
<li><a href="#">待</a></li>
li a{
display:block;
padding:17px;
text-decoration:none;
font:20px arial;
color:black;
}
所以我原本认为 li元素的高度宽度 都应该是17*2+20=54
然而我开启开发者模式 看到的是以下这样：

高度是58
请问为什么高度不是预期的54 而是58 多出来的4px 是哪来的？

f12不是有个区块会显示整体 padding margin border. .从那边看吧

应该是行高的问题，每个浏览器都会默认给1.0-1.2不等的line height，显示的方块有包含行高。试试看设line-height:1不过这样设可能还是会差1px左右，这问题可以参考这篇 https://goo.gl/wNzV9N