@font-face中的font-variant是否已废弃？相关技术咨询

验证器报错的原因 #

你遇到的验证器错误，本质是标准版本的差异：

• CSS 2规范中，font-variant作为单一属性存在，支持small-caps等值，可用于@font-face规则。
• CSS 3及后续的Fonts模块规范中，font-variant被拆分为一系列更细分的属性（如font-variant-caps、font-variant-numeric），原有的单一font-variant属性在@font-face的现代规范中不再被推荐，这也是CSS验证器选择“CSS Level 3 + SVG”标准时报错的原因。

但需要明确：浏览器对CSS 2的font-variant: small-caps在@font-face中的支持依然广泛，实际使用中不会出现兼容性问题，报错只是验证器严格遵循现代规范的提示。

能不能/应该在@font-face中使用font-variant？ #

• 可以用：现代浏览器都兼容CSS 2的font-variant写法，不会影响功能。
• 更推荐用现代写法：遵循最新规范，应该使用font-variant-caps: small-caps替代原有的font-variant: small-caps，这样既能通过CSS验证，也更符合语义化的属性设计。

MDN列出的@font-face属性中，哪些不推荐使用（除未完全支持的）？ #

除了font-variant外，还有这些属性或写法不符合现代规范，不推荐优先使用：

• font-feature-settings：虽然浏览器支持，但它是底层的OpenType特性控制属性，可读性差且容易出错。推荐使用语义化的font-variant-*系列属性（如font-variant-ligatures、font-variant-numeric）替代，这些属性更直观，也符合现代规范。
• font-stretch的旧关键字取值：比如ultra-condensed、extra-expanded等，虽然仍被支持，但现代规范更推荐使用百分比取值（如75%对应condensed），百分比取值更灵活，也能精确控制字体拉伸程度。
• font-weight的相对值：在@font-face中使用bolder或lighter是不符合规范的，必须使用数值（如400、700）或明确的关键字（normal、bold）。

内容的提问来源于stack exchange，提问作者Miloš Šimek