CSS：解决“字体重量：更轻”不起作用

Question

我看不到渲染结果之间的任何差异

font-weight: normal

和

font-weight: lighter

我在 linux 上使用 FireFox 50.0。

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

数字 (100..900) 在我的眼睛中没有显示出任何明显的变化。

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

背景

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

Answer 1

编辑：考虑到问题，这个答案是建议使用font-family具有扩展权重的a能够低于300。

为了最好地说明它，创建了以下代码片段示例：（“Muli”字体系列仅用于演示，可以在Google Fonts 中找到）：

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;
}

<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>