@font-face { font-family: Calibri light; font-style: normal; src: url(calibri_light.woff); } p { font-family: Calibri light;

Well, nothing at all, on the layout of one on the site more. Syntax any different set did not help

    2 answers 2

    Run the font through the fontbel or a similar generator (for example, http://everythingfonts.com/font-face ), get a set of generated fonts and styles like

     @font-face { /*HelveticaC Bold*/ font-family: 'HelveticaCBold'; src: url('../fonts/helveticac-bold.eot'); src: url('../fonts/helveticac-bold.eot') format('embedded-opentype'), url('../fonts/helveticac-bold.woff') format('woff'), url('../fonts/helveticac-bold.ttf') format('truetype'), url('../fonts/helveticac-bold.svg#HelveticaCBold') format('svg'); font-weight: normal; font-style: normal; }

    Please note that if the name of the font does not consist of one word, but of several, then the name should be quoted.

     @font-face { font-family: 'Calibri light'; }

    and when using too

     p { font-family: 'Calibri light'; }

    Also note that in the generated styles in src you will need to add the path to the folder where you put the fonts, for example, ../fonts/
    A font connected in this way will be supported in all modern browsers, and in older versions, except very ancient ones.

    • thank! now everything is clear) - reddyk

    I also couldn’t embed fonts using the standard method. As an alternative to fontsquirrel - javascript-plugins, an example of which is Sufón . Supported by ancient and modern browsers, see here for strengths and weaknesses. I'd add that even if you tick the right places , not all special characters are displayed, including such common ones as “quotes-Christmas trees”; the colors of the visited and active links also do not change. Thank.