You can see that there are four declarations of fonts. One's regular, one's bold, one's italic, and one's bold/italic. However, they all have the same value for font-family: "Adobe Clean".
I was under the impression that that needs to be a unique name, cause now when any element is given font-family: "Adobe Clean", there are four font styles to choose from (I assume that the last one will be used).
So my question is, am I correct? Or is the code above actually fine? Reason I'm asking is because someone else (not a newbie, quite an expert) claims it's correct so I'm seriously doubting my own understanding of this.
Indeed, it turns out that’s exactly what it does. All four font styles (regular, italics, bold, and bold italics) have the same name, but when the text in the markup is wrapped in `` tags, it will take the second one. When the text in the markup is wrapped in ``, it will take the third one. And then when both tags are used, it will take the fourth one.
This reply has been reported for inappropriate content.
I’ve been doing this quite a while with Font-Faces and it works fine.
What you’re effectively doing is providing multiple versions of the font but with different weight/style parameters.
For example, if p/h tags are set to use this font, then you choose, font-style: italic; it will select the version that has “italic” font-style. Similarly for font-weight. You don’t need to explicitly select one, rather it chooses the one that matches for you.