You need to connect the fonts to the page, but they are not connected and the Google console also swears: 'GET file: /// C: /Users/.../GamePage/style/font/DINPro-Black.otf net :: ERR_FILE_NOT_FOUND' What is interesting this particular font (DINPro-Black) was connected, i.e. It works while 2 others who try to connect in no way want to be displayed as needed (in appearance it looks like sans-serif). enter image description here

@font-face { font-family: DINPro Black; src: url(font/DINPro-Black.otf); font-family: Open Sans Light; src: url('font/OpenSans-Light.ttf'), url('font/OpenSans-Light.otf'); font-family: Open Sans ExtraBold; src: url('font/OpenSans-Extrabold.ttf'), url('font/OpenSans-Extrabold.otf'), url('font/opensans-extrabold-webfont.woff') format('woff'); 

}

PS Fonts downloaded from the font.

  • In the console, an error is clearly written. Not found. Check the path to the files. - Tsyklop

1 answer 1

Try this:

 @font-face { font-family: DINPro Black; src: url(../font/DINPro-Black.otf); font-family: Open Sans Light; src: url('../font/OpenSans-Light.ttf'), url('../font/OpenSans-Light.otf'); font-family: Open Sans ExtraBold; src: url('../font/OpenSans-Extrabold.ttf'), url('../font/OpenSans-Extrabold.otf'), url('../font/opensans-extrabold-webfont.woff') format('woff');