字体 - 自己的字体在 OPERA 中不起作用，未知属性"答案

【问题标题】：Font face - own font doesnt work in OPERA ,,unknown property"字体 - 自己的字体在 OPERA 中不起作用，未知属性"
【发布时间】：2016-09-26 18:10:15
【问题描述】：

.title_font{
        font-family: montserrat;
        src: url("/assets/font/Montserrat-Light.otf") format("opentype");
}
  @font-face {
font-family: 'montserrat';
src: url('/assets/font/Montserrat-Light.otf') format("opentype");
font-weight: bold;

}

这些都不起作用...你能帮帮我吗？它说 Unknown property ... 字体的路径很好。

【问题讨论】：

第一个代码无效，但@font-face 规则应该有效。 “未知属性”通常表示拼写错误，您可以使用原始代码创建在线版本吗？

标签： fonts font-face opera

【解决方案1】：

可选的第一步：将您的 OTF 转换为 WOFF，因为您希望浏览器知道这不仅仅是一种通用系统字体，而是您打算在线使用的一种。 WOFF 解析不像通用系统字体规则那样严格，并且 WOFF 使用可选的 zlib (WOFF)/brotli (WOFF2) 压缩逐字节地包装 ttf/otf 源，从而使字体在网络上显着变小。

然后，一个甚至不是远程可选的第二步：您将此资源定义为仅在字体系列为montserrat并且设置权重时使用到bold（或数值700，这在CSS中是一样的）。因此，当您取消权重时，您的字体资源不适用，因为这会导致权重为 normal/400，因此应该明确不映射到 @font-face 声明你显示。

如果您希望它将您的字体应用到任何粗细，请在您的 @font-face 声明中删除该 font-weight 限制，或者更好的是：提供一个正确的列表，列出要使用哪个资源来用于哪个粗细/样式组合。

@font-face {
  font-family: montserrat;
  src: url(.../regular.woff) format("woff");
  style: normal;
  weight: normal;
}

@font-face {
  font-family: montserrat;
  src: url(.../light.woff) format("woff");
  style: normal;
  weight: 300;
}

@font-face {
  font-family: montserrat;
  src: url(.../bolditalic.woff) format("woff");
  style: italic;
  weight: bold;
}

等等。

【讨论】：