2

即使使用 Web 字体，假设 font-weight:normal 和 font-weight:400 是等价的是否仍然合理？

4

2 回答 2

3

在价值上font-weight，normal顾名思义400。这不依赖于字体。

使用，即使字体实际上是粗体（或浅色或其他） ，也可以通过将字体声明为具有正常粗细（默认为 ，或将其设置为或）@font-face来作弊。Fontsquirrel @font-face 生成器这样做：它有效地将每个字体定义为一个字体系列。例子：font-weightnormal400

/* Generated by Font Squirrel (http://www.fontsquirrel.com) on January 22, 2013 */
@font-face {
    font-family: 'source_sans_probold';
    src: url('sourcesanspro-bold-webfont.eot');
    src: url('sourcesanspro-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('sourcesanspro-bold-webfont.woff') format('woff'),
         url('sourcesanspro-bold-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}

这意味着一个元素可能具有 的font-weight值400，即使实际使用的字体是粗体设计。

400这与vs.的使用没有任何关系normal，而且不仅仅是字体粗细。FontSquirrel 与font-style.

于 2013-02-03T07:55:30.377 回答
1

这可能不是最终的答案，但现在必须这样做——我浏览了 Google Web Fonts 上的全部 617 种字体。从我所见，Normal 始终是 400。所有当前字体都指定 Normal，400。

我应该补充的一件事——有一些 WOFF 字体，例如 Open Sans Condensed，实际上根本没有“正常”样式。但是，这不应破坏 Normal = 400 的假设。

这是 Chrome 的一个有趣的陷阱。它默默地将 font-weight:700 替换为 font-weight:bold。它不会尝试使用其他字体粗细来做到这一点。即使如此，如果您依赖数值，最好进行静默测试以进行必要的替换。类似的东西

var sample = $('#fontSampleA');
var fontwt = sample.css('font-weight');
fontwt = ('normal' == fontwt)?400:(('bold' == fontwt)?700:(('book' == fontwt)?300:fontwt));

以防万一将来的版本开始尝试进行更多无声的“智能转换”。

于 2013-02-03T07:02:19.893 回答