How to properly connect the font to the site?

Question

css

Hello guys, such a question, how to correctly connect the font with icons to the site? I created a separate folder for fonts "fonts". I specify the path to the font "It is in the same folder"
Here's how I connected it:

@font-face {
  font-family: 'icomoon';
  src:url('../fonts/icomoon.eot?-cemaup');
  src:url('../fonts/icomoon.eot?#iefix-cemaup') format('embedded-opentype'),
    url('../fonts/icomoon.woff?-cemaup') format('woff'),
    url('../fonts/icomoon.ttf?-cemaup') format('truetype'),
    url('../fonts/icomoon.svg?-cemaup#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}

But the font still does not appear, I'm at a loss, then I took the style file, and the font files and threw them into the "css" folder, and also left the path to these fonts only for the "fonts" place in the path, I wrote "css" . And what's interesting is that the font is connected, I don't understand what could be the problem ... tell me.

Answer 1

Google Fonts

Answer 2

here is the resource , fill in the font there and it will convert it to all formats and give the canonical css code for connection

Answer 3

I do not know what kind of magic you have, I recently had such a problem. Everything was solved by putting web font format (.woff) in the first line, and not embeded, and everything works:

@font-face {
  font-family: 'icomoon';
  src:url('../fonts/icomoon.woff');

Answer 4

I wrote about how to connect fonts so that they load quickly in an article .

Answer 5

I encountered it myself, it is also possible that you will initially download a headset without Cyrillic.