font-variant

Baseline 已廣泛支援

此特性已相當成熟，可在許多裝置和瀏覽器版本上使用。自 ⁨2015 年 7 月⁩以來，各瀏覽器均已提供此特性。

font-variant 屬性指示文字是否要使用字型字形的變體進行渲染。

注意： 作為表示屬性，font-variant 還有一個 CSS 屬性對應項：font-variant。當兩者都被指定時，CSS 屬性具有優先權。

你可以將此屬性與以下 SVG 元素一起使用

示例

控制 SVG 字型變體

html

<svg viewBox="0 0 250 30" xmlns="http://www.w3.org/2000/svg">
  <text y="20" font-variant="normal">Normal text</text>
  <text x="100" y="20" font-variant="small-caps">Small-caps text</text>
</svg>

用法說明

值	`normal` \| `none` \| [ `<common-lig-values>` \|\| `<discretionary-lig-values>` \|\| `<historical-lig-values>` \|\| `<contextual-alt-values>` \|\| `stylistic( <feature-value-name> )` \|\| `historical-forms` \|\| `styleset( <feature-value-name># )` \|\| `character-variant( <feature-value-name># )` \|\| `swash( <feature-value-name> )` \|\| `ornaments( <feature-value-name> )` \|\| `annotation( <feature-value-name> )` \|\| [ `small-caps` \| `all-small-caps` \| `petite-caps` \| `all-petite-caps` \| `unicase` \| `titling-caps` ] \|\| `<numeric-figure-values>` \|\| `<numeric-spacing-values>` \|\| `<numeric-fraction-values>` \|\| `ordinal` \|\| `slashed-zero` \|\| `<east-asian-variant-values>` \|\| `<east-asian-width-values>` \|\| `ruby` ]
預設值	`normal`
可動畫的	是

關於值的說明，請參閱 CSS font-variant 屬性。

規範

規範
CSS 字型模組第 4 級 # font-variant-prop
Scalable Vector Graphics (SVG) 2 # FontVariantProperty

瀏覽器相容性

另見

CSS font-variant 屬性

幫助改進 MDN

瞭解如何貢獻

此頁面最後修改於 2025年7月17日，作者為 MDN 貢獻者。

在 GitHub 上檢視此頁面 • 報告此內容的問題