您可以OTF使用@ font-face 来实现字体，例如：

@font-face {
    font-family: GraublauWeb;
    src: url("path/GraublauWeb.otf") format("opentype");
}

@font-face {
    font-family: GraublauWeb;
    font-weight: bold;
    src: url("path/GraublauWebBold.otf") format("opentype");
}

但是，如果您想支持各种现代浏览器，我建议您切换到WOFF和TTF字体类型。WOFF每种主流桌面浏览器都可以实现该TTF类型，而旧版Safari，Android和iOS浏览器都可以使用该类型。如果您的字体是免费字体，则可以使用例如onlinefontconverter来转换字体。

@font-face {
    font-family: GraublauWeb;
    src: url("path/GraublauWebBold.woff") format("woff"), url("path/GraublauWebBold.ttf")  format("truetype");
}

如果要支持几乎所有仍在其中的浏览器（恕我直言，则不再需要），则应添加更多字体类型，例如：

@font-face {
    font-family: GraublauWeb;
    src: url("webfont.eot"); /* IE9 Compat Modes */
    src: url("webfont.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
         url("webfont.woff") format("woff"), /* Modern Browsers */
         url("webfont.ttf")  format("truetype"), /* Safari, Android, iOS */
         url("webfont.svg#svgFontName") format("svg"); /* Legacy iOS */
}

您可以在此处详细了解为什么要实现所有这些类型及其破解。