Font face - own font doesnt work in OPERA ,,unknown property"

Question

.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;

}

NEITHER OF THESE is working... can you help me ? It says Unknown property ... path to the font is good.

Answer 1

Optional step one: convert your OTF to WOFF, because you want the browser to know that this is not just a generic system font, but one you intended to use online. WOFF parsing is not as strict as generic system font rules, and WOFF wrap ttf/otf sources byte for byte with optional zlib (WOFF)/brotli (WOFF2) compression, making the fonts significantly smaller over the wire.

Then, a not even remotely optional step two: you're defining this resource to only be used when the font family is montserrat and the weight is set to bold (or numerical value 700, which is the same thing in CSS). As such, your font resource does not apply when you leave off the weight, because that results in a weight that is normal/400, and so should clearly not map to the @font-face declaration you show.

If you want it to apply your font to any weight, remove that font-weight restriction in your @font-face declaration, or better yet: supply a proper list of which resource to use for which weight/style combination.

@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;
}

and so on.