问如何在Chrome扩展中使用.tff字体？

EN

我是CSS的新手，不知道为什么它不能工作。我从网上下载了一个.tff字体，并将其放在popup.css旁边的css文件夹中。这不是一个内容脚本扩展，如果有区别的话(这种字体在弹出窗口和设置页面中使用)，我在chrome扩展上通过"load unpacked“加载我的扩展。

popup.css

@font-face{
 font-family:'digital-7';
 src: url("./digital-7.ttf");
}

.digit {
  font: digital-7;
  color: blue;
  display: inline-block;
  font-weight: 'bold';
  font-size: 32px;
}

我的一个React组件文件中有问题的元素：

<div className="digit">{this.state.seconds}</div>

我尝试将type="text/css"添加到div中，也尝试提交url()，因为我不确定为什么需要这样做，但这些都不起作用。这与清单文件有关吗？我甚至看不到任何我能看到的错误。