Question

有一种简单的方法可以用计算机现代字体显示网页吗？

Answer 1

最简单，最稳定的方法是找到我在http://mirrors.concertpass.com/tex-archive/fonts/cm-unicode/fonts/otf/找到的字体。我从那里使用了cmunrm.otf，base64＆＃39;编辑它并将其作为我的CSS中的字体。

@font-face {
  font-family: "my-font";
  src: url(data:font/truetype;charset=utf-8;base64,T1R...gP5w/kP+RAA format("opentype");
}

body {
  font-family: "my-font";
}

您可以在https://jsfiddle.net/jtvx9auo/

查看示例

虽然您也可以简单地下载otf文件并将其放入您的服务器，但我发现base64ing更可靠，例如尝试使用wkhtmltopdf转换为pdf时。

Answer 2

如果有人仍然偶然发现（2020+）寻找优化的Web字体，而不是上面的答案中使用的较大的.otf字体，我已经通过jsDelivr托管了Computer Modern字体家族CDN。

要使用它，可以将<link>添加到html <head>中，以通过以下地址请求优化的字体：

https://cdn.jsdelivr.net/gh/aaaakshat/cm-web-fonts@latest/fonts.css

然后将Computer Modern Serif或sans-serif系列直接添加到您的css文件中。

示例代码：

<head>
  <!-- Other imports... -->
  <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/gh/aaaakshat/cm-web-fonts@latest/fonts.css">
  <style>
    body {
      font-family: "Computer Modern Serif", serif;
    }
  </style>
</head>

签出full documentation here

如何在网页中使用标准乳胶字体（计算机现代）？

2 个答案: