Question

我有多个字体文件，我需要它将它映射到某些字体权重。

@font-face {
    font-family: "custom-font";
    src: url("font300.eot");
    src: url("font300.eot?#iefix") format("embedded-opentype"),
        url("font300.woff2") format("woff2"),
        url("font300.woff") format("woff"),
        url("font300.ttf") format("truetype"),
        url("font300.svg#font-300") format("svg");
    font-weight: 300, normal;
    font-style: normal;
}

@font-face {
    font-family: "custom-font";
    src: url("font500.eot");
    src: url("font500.eot?#iefix") format("embedded-opentype"),
        url("font500.woff2") format("woff2"),
        url("font500.woff") format("woff"),
        url("font500.ttf") format("truetype"),
        url("font500.svg#font500") format("svg");
    font-weight: 500, bold;
    font-style: normal;
}

我需要将font-weight映射到数字和粗体/正常，这可能吗？这不起作用。我不想复制整个字体面块。

网络需要哪种字体？我可以省略一些吗？（eot，woff2，woff，ttf，svg）

谢谢

Answer 1

无需这样做，字体粗细值会自动解析为相应的数字，请参阅https://developer.mozilla.org/de/docs/Web/CSS/font-weight 因此，只需为数字或速记制定规则。

字体类型取决于您要支持的客户端。有关每种格式的支持，请参阅：

EOT：http://caniuse.com/#feat=eot

WOFF：http://caniuse.com/#feat=woff

WOFF2：http://caniuse.com/#feat=woff2

SVG：http://caniuse.com/#feat=svg-fonts

TTF / OTF：http://caniuse.com/#feat=ttf

使用@ font-face多个font-weight的文件

1 个答案: