Good day to all. In the style sheet to load the web font I use the rule

@font-face { font-family: 'Kurale'; font-style: normal; font-weight: 400; src:url(http://fonts.gstatic.com/s/kurale/v2/qUcQKP0WQHGvJJtuLvvwEg.woff2) format('woff2'); }

Next, successfully apply to paragraph p.

 p { font-family: "Kurale"; font-style: normal; }

But if you specify in the rule p {font-style: italic;} then the font safely turns into kurale KURSIVNY. There are actually two questions:

1) The italic font is stored in this loadable file, or the browser is so smart that it transforms it from normal (it draws itself). THOSE. How does he know how to display the italics of this font;

2) If the italic font is in the file, then the @ font-face {font-style: normal;} rule doesn’t matter to him (the browser) and is he guided only by the font name?

PS I do not own information about the content / content in the italic font file.

  • Browser mozila / chrome latest - Vadim Slepakurov
  • 2
    If the font is in the file, as it usually happens, it will use it. If not, then it mimics italics itself. Therefore, sometimes italics look differently on different systems and browsers. - Nazar Kalytiuk
  • one
    htmlbook.ru/css/font-style is written in the description here, but of course there is no specific algorithm - Nazar Kalytiuk

2 answers 2

There are 3 possible attributes in the font-style property: normal , italic , and oblique .

italic is an italic font (not all fonts have it).

oblique is an oblique font (often just a tilted font).

If the browser sets an italic or oblique style, it will select the specified style. And if the italic style is not, then the browser will select the oblique style, if it exists (by the way, and vice versa as well). And if there are no styles, then the browser will independently simulate the effect of the inclined font.

To control browser behavior in such cases, the font-synthesis property is used ( https://developer.mozilla.org/ru/docs/Web/CSS/font-synthesis )

    If italic Kurale is displayed, then yes, the file contains an italic. You can also try changing the font-weight and see the likely styles also present in the file.

    • But I understand that it is possible and the situation when there is no font and the browser itself draws italics (according to the previous comment?) - Vadim Slepakurov
    • @VadimSlepakurov, that's right, if there is no italics in the font file, then the browser will try to "think it out" its own - br3t
    • Kurale has no italics. - labris
    • @labris fonts.google.com/specimen/Kurale all kinds of styles , unless some custom build of the woff font has been chosen. The link leads to google static, so the mark is most likely present -
    • In Google Fonts, only Regular outline is available for Kurale, if you find something else, please let us know. - labris