css - 如何让 'font-weight: lighter' 在 Google Chrome 中工作？

Question

在 Google Chrome(可能还有 Safari)中，'font-weight: normal' 和 'font-weight: bold' 之间似乎没有任何区别。有没有人找到像 Firefox 那样在 Chrome 中调用“font-weight:thinner”的方法？

Answer 1

这似乎是一个 known issue在 Chrome 中修复了最新的开发版本:

有一个temporary workaround你也可以试试:

To enable the font-weight property on a @font-face font which doesn't have a bold font defined, you need to explicitly define font-weight:normal; and font-style:normal; in the @font-face definition. Example:

@font-face {
    font-family: 'GriffosFont Regular';
    font-weight: normal;
    font-style: normal;
    src: url('fonts/GriffosFont.eot');
    src: local('GriffosFont Regular'), local('GriffosFont'), url('fonts/GriffosFont.woff') format('woff'), url('fonts/GriffosFont.\
ttf') format('truetype'), url('fonts/GriffosFont.svg#GriffosFont') format('svg');
}