css - 如何从GitHub显示不同权重的Noto Sans？

我无法显示不同重量（薄，常规，黑色）的Noto Sans。我在GitHub的noto-fonts / unhinted目录中找到了.ttf文件。如何显示具有不同粗细的字体？

我正在使用Google Chrome 71.0.3578.98版本。

@font-face {
font-family: 'Noto Sans Thin';
font-weight:100;
font-style:normal;
src: url(https://github.com/googlei18n/noto- fonts/blob/master/unhinted/NotoSans-Thin.ttf?raw=true) format('truetype');
}

@font-face {
font-family: 'Noto Sans Regular';
font-weight:400;
font-style:normal;
src: url(https://github.com/googlei18n/noto-fonts/blob/master/unhinted/NotoSans-Regular.ttf?raw=true) format('truetype');
}

@font-face {
font-family: 'Noto Sans Black';
font-weight:900;
font-style:normal;
src: url(https://github.com/googlei18n/noto-fonts/blob/master/unhinted/NotoSans-Black.ttf?raw=true) format('truetype');
}

.thin{
font-family:'Noto Sans Thin';
}
.black{
font-family:'Noto Sans Black';
}
.regular{
font-family:'Noto Sans Regular';
}


<p class="thin">Thin</p>
<p class="regular">Regular</p>
<p class="black">Black</p>

Thin和Regular之间没有视觉差异。我想得到与这里相同的结果：https://www.google.com/get/noto/#sans-lgc

最佳答案

简而言之，github不允许嵌入托管在其服务器上的文件供其他域使用。他们有严格的CORS政策，并且很明确。

如果要使用这些文件，则需要将它们上传到服务器上并进行相应的链接。

所有Noto字体均在SIL Open Font License（OFL）v1.1下发布，该字体允许您在需要时进行复制，修改和重新分发。