使用 -apple-system 进行等宽和衬线

Question

我知道

-apple-system

在 macOS 和 iOS 上默认为 San Francisco，但是什么默认为 SF Mono 和 New York（Apple 产品的默认衬线字体）？

Answer 1

从 Safari 13.1 开始，他们为系统字体添加了字体系列名称：

• ui-monospace

  — SF Mono

• ui-serif

  ——纽约

• ui-sans-serif

  ——旧金山（与

  system-ui

  和

  -apple-system

  相同）

参见博文。

我在大多数平台上用来获取系统等宽的CSS如下：

code {
  font-family: 'SF Mono', SFMono-Regular, ui-monospace,
    'DejaVu Sans Mono', Menlo, Consolas, monospace;
}

前三个是 SF Mono，然后是 Linux (DejaVu) 和 Mac (Menlo) 上的 Bitstream Vera 派生字体，最后是在 Windows (Consolas) 上可用的任何字体。