我正在尝试使用font-stretch:condensed，但在检查时它在 Google Chrome 开发人员工具中显示为无效。
它在 Firefox 中呈现良好。
问问题
7147 次
3 回答
12
Chrome 尚不支持 to font-stretch。
开发者工具歪曲了这种情况：它是对 Chrome “无效”的属性 font-stretch，即 Chrome 不支持，而不仅仅是特定值condensed。但是，Chrome 可以识别该名称；如果您声明foo: bar，那么工具会告诉您这foo是一个未知的属性名称。
作为一种解决方法，将您希望使用的精简字体声明为 的值font-family，即好像它是一个字体系列，而不仅仅是一个系列中的特定字体。例如，而不是
font-family: Bodoni MT;
font-stretch: condensed;
（它适用于 IE 10，但不适用于 Chrome 或 Firefox，尽管后者声称支持font-stretch）你会写
font-family: Bodoni MT Condensed;
字体的特定名称必须是其 PostScript 名称或全名，如字体文件中与nameID值 4 和 6 对应的名称表中给出的那样。您可以使用DTL OTMaster Light找到此数据。
请注意，使用特定字体与font-stretch定义相同，请参阅CSS Fonts Module Level 3 LC。这个名字font-stretch用词不当；该属性不会拉伸字体——它只在存在这样的字体时选择具有给定宽度的字体。
于 2013-09-12T05:36:29.810 回答
1
该font-stretch属性不是任何最终标准的一部分，Chrome 也不支持它。请参阅MDN 上的字体拉伸。
于 2013-09-11T23:10:51.107 回答
0
差不多十年后，Chrome 似乎仍然不完全支持font-stretch- 即使根据https://developer.mozilla.org/en-US/docs/Web/@font-face应该可以在存在声明的情况下使用它CSS/字体拉伸。但是，我成功地使用了 rookie1024 评论中建议的方法，即使用以下简单的 CSS 类：
.condensed-text {
transform: scaleX(0.7);
}
于 2022-02-22T08:00:38.037 回答