【发布时间】：2013-09-11 23:08:36
【问题描述】：
我正在尝试使用font-stretch:condensed，但在检查时它在 Google Chrome 开发者工具中显示为无效。
它在 Firefox 中呈现良好。
【问题讨论】：
标签： css google-chrome fonts
【发布时间】：2013-09-11 23:08:36
【问题描述】：
Chrome 中尚不支持font-stretch。
开发人员工具歪曲了这种情况：属性 font-stretch 对 Chrome 来说是“无效的”，即 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 这个名字用词不当；该属性不会拉伸字体——它仅在存在这样的字体时选择具有给定宽度的字体。
【讨论】：
-
这是 Chrome 的那些奇怪的怪癖之一，其中属性似乎是有效的，即使它尚未实现。我认为
transform（而不是-webkit-transform）有时会这样做。
font-stretch 属性不是任何最终标准的一部分，Chrome 也不支持它。见font-stretch on MDN。
【讨论】：
大约十年后，Chrome 似乎仍然不完全支持 font-stretch - 尽管按照 https://developer.mozilla.org/en-US/docs/Web/CSS/font-stretch 声明应该可以在存在 @font-face 声明的情况下使用它。但是，我成功地使用了 rookie1024 评论中建议的方法，即使用以下简单的 CSS 类：
.condensed-text {
transform: scaleX(0.7);
}
【讨论】：