CSS font-variant 属性用于将指定的文本显示为小型大写字体。该属性的作用是将英文的小写字母转换为比正常大写字母尺寸小一号的大写字母。

在CSS2中，font-variant属性的值可以是：normal或small-caps。normal表示使用正常的字体。small-caps表示将字母转换为小型大写字体。如果你指定的没有小型大写字体的变体，浏览器可能会将文字显示为该字体大写字母的缩小版本，或者直接使用大写字母作为小型大写字母。

使用font-variant属性时需还要注意text-transform属性对文字的影响。如果你将一段文本的font-variant属性设置为small-caps，同时使用text-transform属性将这段文本转换为小写字母，那么所有的文字都会显示为小写。

元素可以从它的父元素中继承font-variant的值。

注意，font-variant属性的small-caps值对本身就是大写字母的文本无效。例如，在HTML代码中，你使用大写字母写了一段文本，然后你想通过font-variant: small-caps将这段话设置为小型大写字母，得到的最终结果是：这段话显示为正常的大写字母。

在CSS3中，font-variant属性变为了font-variant-caps， font-variant-numeric， font-variant-alternates， font-variant-ligatures 和 font-variant-east-asian属性的简写方式。

在CSS3中，font-variant属性还增加了一些新的值：all-small-caps， unicase， titling-caps 和 petite-caps。目前没有浏览器支持这些新值。

官方语法

font-variant: normal | small-caps | inherit      
                            

参数：

• normal：显示为正常字体。
• small-caps：显示为小型大写字体。
• inherit：继承父元素的font-variant属性。

font-variant属性的初始值为normal。

应用范围

font-variant属性可以应用在所有的元素上。

示例代码

font-variant: normal;
font-variant: small-caps;

font-variant: inherit;                             
                            

在线演示

浏览器支持

所有的浏览器都支持font-variant属性，包括Chrome, Firefox, Safari, Opera, Internet Explorer 以及 Android 和 iOS。

在IE6和IE7中设置font-variant: small-caps属性，会使应用在这些文本中的text-transform: uppercase或text-transform: lowercase变为text-transform: none。