font-feature-settings
font-feature-settings CSS 描述符允许您定义用于 @font-face at-rule 所定义字体的初始设置。您还可以使用此描述符来控制 @font-face 定义字体的排版字体特性,例如连字、小型大写字母和花式字。此描述符的值与 font-feature-settings 属性的值相同,但全局关键字值除外。
由于此描述符在 @font-face at-rule 中设置字体对象上的特性值,而不是在整个元素上设置,因此元素中只有部分字形可能会使用此描述符进行渲染。
语法
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;
值
此描述符被指定为关键字 normal 或逗号分隔的 <feature-tag-value> 值列表。渲染文本时,OpenType <feature-tag-value> 值列表会传递给文本布局引擎以启用或禁用字体特性。
normal-
表示使用默认字体设置进行文本布局。这是默认值。
<feature-tag-value>-
表示由标签名称和可选值组成的空格分隔的元组。
标签名称始终是四个 ASCII 字符的
<string>。如果标签名称的字符多于或少于四个,或者包含U+20–U+7E码点范围之外的字符,则描述符无效。可选值可以是正整数或关键字
on或off。关键字on和off分别是值1和0的同义词。如果未设置值,则默认为1。对于非布尔型 OpenType 特性(例如,样式替代),该值表示要选择的特定字形;对于布尔型特性,该值打开或关闭该特性。
正式定义
| 相关的 at-rule | @font-face |
|---|---|
| 初始值 | normal |
| 计算值 | 同指定值 |
正式语法
font-feature-settings =
normal |
<feature-tag-value>#
示例
使用 @font-face at-rule 启用花式字形
在此示例中,标签名称 swsh 和布尔值 1 用作 @font-face at-rule 中 font-feature-settings 描述符的值。
HTML
html
<p class="swash-off">Swash is off here</p>
<p class="swash-on">Swash is on here</p>
CSS
css
@font-face {
font-family: "MonteCarlo";
src: url("/shared-assets/fonts/monte-carlo/monte-carlo-regular.woff2");
}
@font-face {
font-family: "MonteCarlo2";
src: url("/shared-assets/fonts/monte-carlo/monte-carlo-regular.woff2");
font-feature-settings: "swsh" 1;
}
p {
font-size: 3rem;
margin: 0.7rem 3rem;
}
.swash-off {
font-family: "MonteCarlo", cursive;
}
.swash-on {
font-family: "MonteCarlo2", cursive;
}
结果
第 1 行显示 MonteCarlo 字体的默认华丽设计,第 2 行显示默认字形被 花式字 字形替换。
规范
| 规范 |
|---|
| CSS 字体模块第 4 级 # font-rend-desc |
浏览器兼容性
加载中…
另见
- 其他
@font-face描述符:font-family、font-style、font-variation-settings、font-weight、src - 相关字体属性:
font-feature-settings、font-variant-alternates、font-variation-settings