以与其周围相同的字体大小显示等宽字体答案

【问题标题】：Display monospace fonts at the same font size as their surroundings以与其周围相同的字体大小显示等宽字体
【发布时间】：2020-03-11 10:38:28
【问题描述】：

我正在使用这个众所周知的技巧来使等宽字体使用与比例字体相同的字体大小：

code, kbd, tt, pre, samp, textarea {
  font-size:1em;
  font-family: monospace, monospace;
}

因为默认情况下浏览器使用较小的等宽尺寸，而不同的浏览器使用不同的尺寸，所以这个技巧是一种让不同浏览器看起来更相似的方法。

但是，我发现这不适用于大多数 Android 浏览器！显然，monospace, monospace 在基于 Chrome 的移动浏览器中被认为是一个错误，它们使用默认的比例字体代替。（火狐没问题。）

那么，有人知道解决方法吗？我尝试了monospace, serif 之类的变体，但也没有用。

【问题讨论】：

标签： css cross-browser css-hack

【解决方案1】：

我的测试表明，如果您的字体系列堆栈中的某处有 Courier 或 "Courier New"（或两者），那么您现在可以在 Android 上使用 Chrome。您也可以添加其他字体并以monospace 结尾，但显然您至少需要其中一种。没有它们，您要么仅使用font-family: monospace 获得较小的字体，要么您将根本无法使用任何其他font-family 获得等宽字体。叹息。

我使用 browserstack.com 对 Galaxy S7 和 Nexus 6 的屏幕截图进行了测试，但后来的手机也收到了客户投诉。大概有一天，这会在 Android 上的 Chrome 中得到修复。

【讨论】：

【解决方案2】：

查看 Google Monospace 字体：https://fonts.google.com/?category=Monospace。直接在您的网站上使用这些。 monospace 将尝试使用系统定义的等宽字体。

【讨论】：

抱歉，这能解决我的问题吗？我也可以使用“Courier New”来获得它的价值，但这不是问题所在。
不确定您要达到的目标，但这可能会对您有所帮助：stackoverflow.com/a/16364321/7331574
我不知道要对我的帖子进行哪些更改以明确我想以与比例字体相同的大小显示等宽字体。