等宽字体抛出行高

Question

假设我有以下内容：

这是一个包含一些代码的段落。

具有以下样式：

p {
    字体：16px/24px 无衬线；
}
代码 {
    字体：16px/24px 等宽字体，无衬线字体；
}

为什么代码元素会超出我的行高？这是一个说明问题的 jsFiddle：http://jsfiddle.net/sl1dr/chgyb/

编辑：经过进一步调查，我发现我链接的小提琴在 Mac 上工作正常，但在 Windows 上却不行。这变得越来越有趣，因为我正在工作的网站在 Mac 和 Windows 上都存在问题。

Answer 1

这不是

line-height

的更改，这是因为大多数不同的

font-family

的字体周围有不同的边距。但是

font-margin

不是你可以用 css 改变的东西。所以你是对的，你需要改变

line-height

Answer 2

我找到here一个可行的解决方案，即再次设置

font-size

并将

font-family

设置为

monospace, monospace

。