CSS：解决方法＆＃34; font-weight：lighter＆＃34;不工作

Question

我无法看到

的渲染结果之间存在任何差异

sess, err := session.NewSession(&aws.Config{
    Region:      aws.String("us-west-2"),
    Credentials: credentials.NewStaticCredentials(conf.AWS_ACCESS_KEY_ID, conf.AWS_SECRET_ACCESS_KEY, ""),
})

和

font-weight: normal

我在linux上使用FireFox 50.0。

有没有办法让font-weight: lighter 可见？

数字（100..900），不会显示我的眼睛有任何明显的变化。

以下是一个示例页面：https://wiki.selfhtml.org/wiki/CSS/Eigenschaften/Schriftformatierung/font-weight

背景

我的字体不支持较轻的字体粗细。是的，我可以使用不同的字体。但是更改字体超出了我的范围。

Answer 1

编辑：此答案建议使用具有扩展权重的font-family，以便能够低于300，并考虑以下问题。

为了更好地说明，我们创建了以下代码段示例：（＆＃34; Muli＆＃34; font-family仅用于演示，可以在Google Fonts中找到）：

＆＃13;

＆＃13;

body {
  font-family: 'Muli', sans-serif;
}
.thin {
  font-weight: 200;
}
.light {
  font-weight: 300;
}
.regular {
  font-weight: 400;
}
.bold {
  font-weight: 600;
}
.extraBold {
  font-weight: 700;
}
.black {
  font-weight: 800;
}
.extraBlack {
  font-weight: 900;
}

＆＃13;

<link href="https://fonts.googleapis.com/css?family=Muli:200,300,400,600,700,800,900" rel="stylesheet">
<p class="thin">weight 200</p>
<p class="light">weight 300</p>
<p class="regular">weight 400</p>
<p class="bold">weight 600</p>
<p class="extraBold">weight 700</p>
<p class="black">weight 800</p>
<p class="extraBlack">weight 900</p>

＆＃13;

＆＃13;

＆＃13;

Answer 2

我找到了一个解决方法：css opacity

以下是截图，其中显示了三种样式：

• 正常
• font-weight: lighter
• font-weight: bold