Question

我想使用＆＃34; Roboto＆＃34; prestashop中的字体。我收到了.psd文件中的设计和图形设计器使用的字体＆＃34; Roboto Medium＆＃34;和＃34; Roboto Regular＆＃34;。我是否理解正确，当我想使用Roboto Normal时我可以申请：

font- family: "Roboto"
font-weight: 400

当我想使用Roboto Medium时，我应该申请：

font- family: "Roboto"
font-weight: 500

换句话说，权重400和500分别等于Roboto Normal和Roboto Medium？

Answer 1

确保关闭CSS行。

font-family: "Roboto";
font-weight: 400;

是的，你的体重是正确的，

font-weight: 400; //normal
font-weight: 500; //medium
font-weight: 700; //bold

关于font-weight，请阅读this，但根据字体的不同，它并不总是可用。但是，根据Google，您应该可以毫无问题地使用这些权重。

Answer 2

最初我也对此感到困惑。

我有一个客户要求，根据他们的风格指南，我需要为“ Roboto”，“ Roboto Medium”，“ Roboto Light”等设置相应的字体。

查看Google的字体网站（https://fonts.google.com/specimen/Roboto），其中显示了“ Roboto”字体，然后显示了“ Medium”，“ Light”等每种变体的示例。

但这并不明显涉及CSS中的两个设置。我最初的想法是您将其设置如下：

* {font-family: 'Roboto Light', 'Roboto Medium', 'Roboto', etc}

但是经过试验和一些研究后，它涉及两个设置，一个是指定核心“家庭”，然后是“权重”，如下所示：

.Roboto{font-family:'Roboto';font-weight:400;} /* 400 is industry standard for normal */

.RobotoLight{font-familiy:'Roboto';font-weight:300;} /* 300 is industry standard for normal */

.RobotoMedium{font-family:'Roboto';font-weight:500;} /* 500 is industry standard for normal */

CSS中的Roboto字体

2 个答案: