And so, here is my fonts.css file

@font-face { font-family: "Dosis Book"; /* Имя шрифта */ src: url('../fonts/dosis-book-webfont.eot'); /* Путь к файлу со шрифтом */ src: url('../fonts/dosis-book-webfont.ttf'); /* Путь к файлу со шрифтом */ src: url('../fonts/dosis-book-webfont.woff'); /* Путь к файлу со шрифтом */ src: url('../fonts/dosis-book-webfont.woff2'); /* Путь к файлу со шрифтом */ src: url('../fonts/dosis-book-webfont.svg'); /* Путь к файлу со шрифтом */ } @font-face { font-family: "Dosis Semibold"; /* Имя шрифта */ src: url('../fonts/dosis-semibold-webfont.eot'); /* Путь к файлу со шрифтом */ src: url('../fonts/dosis-semibold-webfont.ttf'); /* Путь к файлу со шрифтом */ src: url('../fonts/dosis-semibold-webfont.woff'); /* Путь к файлу со шрифтом */ src: url('../fonts/dosis-semibold-webfont.woff2'); /* Путь к файлу со шрифтом */ src: url('../fonts/dosis-semibold-webfont.svg'); /* Путь к файлу со шрифтом */ }

html:

  <link rel="stylesheet" href="css/fonts.css"> <link rel="stylesheet" href="css/style.css"> <link rel="stylesheet" href="css/reset.css">

and scss:

 $main-font-regular : 16px "Dosis Semibold"; font: $main-font-regular;

What could be trabl? In the fireball, the font is gray, not blue.

    2 answers 2

    Because your font on the site you need to connect something like this:

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

    Well, well check the path to the font, there are often mistakes too :)

    • Pkhpshtorm swears at me, if that. It did not work, there was a problem in the font file most likely. I downloaded another — generated — earned - Nikita Shchypylov
    • one
      @NikitaShchipilov, if you are sure that your code works, can you explain why you are connecting, not one file, but 5? Because in your case, you can connect 1 file and nothing will change, others still do not work for the purposes for which they are connected :) - MasterAlex

    This problem occurs when your font does not support Cyrillic (if the text on the site is in Russian), or when generating a web font, you did not select its language.