← 返回 Web 词条

字体族

Web原生支持

在 Web 上叫font-family

CSS: font-family

官方定义是「指定一个按优先级排列的字体族名或通用族名列表」。它与另两端最不同的一点写在后文:字体选择「不是在列表里第一个可用的字体处就停下」,而是逐字符进行 —— 某个字体缺这个字的字形时,会继续往后找。所以备选列表不是摆设。

这段文字用哪一套字,以及系统里找不到那套字时按什么顺序往下退。

  • 换一种字体
  • 用系统默认的那套字
  • 这个字看着不对
  • 字体族
  • 字型家族
  • 字体家族

示例

Webfont-family原生支持点选数值,样本实时变化

把说不清的东西,变成能说清的词。

font-family: var(--font-sans);

其他平台的相似实现

iOS原生支持
custom异名

官方描述是「用给定的名字和尺寸创建一个自定义字体,并随正文文字样式缩放」。

看 iOS 视角 →
Android原生支持
fontFamily同名

官方描述是「渲染文字时使用的字体族」。

看 Android 视角 →

使用规范

什么时候用

  • 品牌要求特定字形时
  • 中英文混排需要分别指定字体时

什么时候别用

  • 只是想让字更粗 → 那是字重,不是换字体
  • 没有备选族名,缺字时会退到无法预期的字体上

容易混淆

Web 出处

查看 Web / iOS / Android 完整对照 →