font-feature-settings - CSS（层叠样式表） 编辑

font-feature-settings 属性用于控制OpenType字体中的高级印刷功能。

The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.

语法

/* 默认设置 */
font-feature-settings: normal;

/* 设置 OpenType 功能标签的值 */
font-feature-settings: "smcp";
font-feature-settings: "smcp" on;
font-feature-settings: "swsh" 2;
font-feature-settings: "smcp", "swsh" 2;

/* 全局值 */
font-feature-settings: inherit;
font-feature-settings: initial;
font-feature-settings: unset;

Note: Web开发者应该尽可能的使用类似 font-variant 这样的短标记属性或者相关的速记标识属性等, 类似 font-variant-ligatures, font-variant-caps, font-variant-east-asian, font-variant-alternates, font-variant-numeric or font-variant-position.

该属性是一个比较偏底层的功能接口，用于解决由于没有其他方法去访问和设置OpenType字体某些特性而无法解决一些特殊功能需求.

特别需要注意的是，该CSS属性不应该用来开启大写字母转换.

初始值	normal
适用元素	all elements. It also applies to ::first-letter and ::first-line.
是否是继承属性	yes
计算值	as specified
Animation type	discrete

值

normal

文本使用默认设置进行布局。

<feature-tag-value>

在呈现文本时，OpenType要素标记值的列表被传递到文本布局引擎以启用或禁用字体特征。标签始终是4个ASCII字符的 <string> 。如果是U + 20 - U + 7E代码点范围以外的字符或字符个数不对，则整个属性无效。 
值是一个正整数。两个关键字on和off分别是1和0的同义词。如果未设置任何值，则默认值为1。对于非布尔型OpenType功能（例如，文体替代 stylistic alternates），该值意味着要选择特定的字形；对于布尔值，它是一个开关。

形式语法

normal | <feature-tag-value>#
where 
<feature-tag-value> = <string> [ <integer> | on | off ]?

实例

/* 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"; }

/* 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; /* available on Windows 7, and on Mac OS */
  font-feature-settings: "ss07";
}

规范

Specification	Status	Comment
CSS Fonts Module Level 3 font-feature-settings	Candidate Recommendation	Initial definition

浏览器兼容性

BCD tables only load in the browser

The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.

其他参考

• FontFont OpenType User Guide (pdf)
• OpenType Feature Tags 列表
• Using the whole font ( -moz语法是旧的。在Gecko上，使用-ms语法，但使用-moz ).