Firefox拒绝了您的字体文件，因为它无法识别TTC字体集合格式。它显示为Firefox doesn't yet support font collections in @font-face。
对于支持集合的浏览器，你需要使用一个片段标识符来从TTC集合中选择一个特定的字体。CSS3字体规范规定片段标识符应该是PostScript名称;使用fontconfig包中的fc-scan命令行工具从TTC文件中获取postscript名称：

$ fc-scan filename.ttc | grep postscriptname

fontconfig是Open Source software from freedesktop.org，请在Linux软件包管理器中找到它，或者在MacOS上使用homebrew安装它。
你可以在URL后面加上format(collection)来告诉浏览器该URL指向一个字体集合，在这种情况下，Firefox甚至不会下载该文件，因为它知道，如果不下载，它将无法使用该集合中的字体。
因此，对于支持TTC文件中字体集合的任何浏览器，语法为：

@font-face {
    font-family: Avenir Next;
    // assumption: the PostScript name for the specific font to pick is
    // Avenir-Next-Regular. Use fc-scan to find the correct fragment ID here.
    src: url('{{ asset("fonts/Avenir Next.ttc") }}#Avenir-Next-Regular') format(collection);
}

由于Firefox还不支持这种功能，所以最好将TTC集合转换为单独的字体;最好是WOFF和WOFF 2，以获得最广泛的支持。有一些在线工具可以为你做到这一点;你应该得到 * 多 * 字体，你需要选择一个与正确的重量从这使用。
src:属性是一个选项列表，浏览器会选择第一个支持的选项，所以你可以为支持集合的浏览器保留TTC文件;这些将下载可在@font-face定义之间共享的单个集合，然后列出WOFF 2和WOFF URL：

@font-face {
    font-family: Avenir Next;
    src:
        url('{{ asset("fonts/Avenir Next.ttc") }}#Avenir-Next-Regular') format(collection),
        url('{{ asset("fonts/Avenir Next Regular.woff2" }}') format(woff2),
        url('{{ asset("fonts/Avenir Next Regular.woff" }}') format(woff);
}

如果有支持字体集合的浏览器，使用TTF集合的好处是可以限制支持多种字体所需的请求数量，而且如果组合字体共享字形信息，则可以更有效地存储组合字体。
最后的警告是，我不知道哪些浏览器支持这个;caniuseidercomm上没有这方面的信息，我有suggested CanIUse could provide this info。

文件.ttc是一个字体集合，而@font-face用于指定浏览器应该使用的一种字体。您需要从该集合中提取一种字体资产，然后在@font-face中使用该字体。例如：

@font-face {
   font-family: "Open Sans";
   src: url("/fonts/OpenSans-Regular-webfont.woff2") format("woff2"),
   url("/fonts/OpenSans-Regular-webfont.woff") format("woff");
}