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