CSS font-variant属性介绍

font-variant属性用于设置文本字体是否以小型大写字母显示。

语法格式如下：

font-variant: normal|small-caps|initial|inherit;

• normal：默认值，文本字体以标准大小呈现；
• small-caps：小型大写字母，将小写字母转换为小型大写字母；
• initial：设置属性值为默认值；
• inherit：继承父元素的属性值。

例如：

p {
  font-variant: small-caps;
}

在上面的例子里，p元素的文本字体将以小型大写字母显示。

适用情况

font-variant属性在网页设计中不是经常用到的属性。可用于创建一个独特的字体效果。对于一些特殊的场合（譬如，对于表格中的表头，可以以小型大写字母形式显示，使其更加突出），font-variant可以有所帮助。也有应用到一些印刷风格的页面设计中。

属性值

小型大写字母

small-caps是在字体中使用了两种大小写字母，离谱字符使用小型大写字母。所谓“小型大写字母”是指字形保持小写字母的缩写，但是以大写字母的形式出现。在CSS中实现小型大写字母通常使用“f”（See FF）和“h”（See HH）这两个字符作为例子。

举个例子:

使用font-variant属性来改变字体：

p {
  font-variant: small-caps;
}

效果如下：

浏览器兼容性

兼容现代浏览器，但在部分老旧浏览器中可能不兼容。如果您要支持那些较旧的浏览器，您需要为它设置前缀。具体请参见：Can I Use

结论

在网页设计中font-variant并不是一个被频繁使用的CSS属性，但在一些罕见的场合下，它可以增强网页的视觉体验。