font-feature-settings

**font-feature-settings** CSS 属性控制 OpenType 字体中的高级排版功能。

试一试

语法

css
/* Use the default settings */
font-feature-settings: normal;

/* Set values for OpenType feature tags */
font-feature-settings: "smcp";
font-feature-settings: "smcp" on;
font-feature-settings: "swsh" 2;
font-feature-settings:
  "smcp",
  "swsh" 2;

/* Global values */
font-feature-settings: inherit;
font-feature-settings: initial;
font-feature-settings: revert;
font-feature-settings: revert-layer;
font-feature-settings: unset;

在可能的情况下，Web 作者应该使用 font-variant 简写属性或相关的长写属性，例如 font-variant-ligatures、font-variant-caps、font-variant-east-asian、font-variant-alternates、font-variant-numeric 或 font-variant-position。

这些方法比 font-feature-settings 更加有效、可预测和易于理解，后者是一个低级功能，用于处理没有其他方法可以启用或访问 OpenType 字体功能的特殊情况。特别是，font-feature-settings 不应该用于启用小型大写字母。

值

此属性被指定为关键字 normal 或逗号分隔的 <feature-tag-value> 值列表。在渲染文本时，OpenType <feature-tag-value> 值列表将被传递给文本布局引擎，以启用或禁用字体功能。

normal

表示使用默认字体设置布局文本。这是默认值。

<feature-tag-value>

表示一个空格分隔的元组，包含一个标签名称和一个可选值。

标签名称始终是 <string>，包含四个 ASCII 字符。如果标签名称包含更多或更少的字符，或者包含超出 U+20 – U+7E 代码点范围的字符，则描述符无效。

可选值可以是正整数，也可以是关键字 on 或 off。关键字 on 和 off 分别是值 1 和 0 的同义词。如果未设置值，则默认为 1。对于非布尔型 OpenType 特性（例如，风格化替换），该值暗示选择特定字形；对于布尔型特性，该值启用或禁用特性。

正式定义

初始值normal
应用于所有元素和文本。它也应用于 ::first-letter 和 ::first-line。
继承是
计算值如指定
动画类型离散

正式语法

font-feature-settings = 
  normal                |
  <feature-tag-value>#  

<feature-tag-value> = 
  <opentype-tag> [ <integer [0,∞]> | on | off ]?  

<opentype-tag> = 
  <string>

示例

启用各种字体功能

css
/* use small-cap alternate glyphs */
.smallcaps {
  font-feature-settings: "smcp" on;
}

/* convert both upper and lowercase to small caps (affects punctuation also) */
.allsmallcaps {
  font-feature-settings: "c2sc", "smcp";
}

/* use zeros with a slash through them to differentiate from "O" */
.nicezero {
  font-feature-settings: "zero";
}

/* enable historical forms */
.hist {
  font-feature-settings: "hist";
}

/* disable common ligatures, usually on by default */
.noligs {
  font-feature-settings: "liga" 0;
}

/* enable tabular (monospaced) figures */
td.tabular {
  font-feature-settings: "tnum";
}

/* enable automatic fractions */
.fractions {
  font-feature-settings: "frac";
}

/* use the second available swash character */
.swash {
  font-feature-settings: "swsh" 2;
}

/* enable stylistic set 7 */
.fancystyle {
  font-family: Gabriola;
  font-feature-settings: "ss07";
}

规范

规范
CSS 字体模块 Level 4
# font-feature-settings-prop

浏览器兼容性

BCD 表格仅在浏览器中加载

另请参阅