@font-face VS @import

user_14734628 0
Viewed 568

While defining a Web Font in CSS - I have noticed a small change in the way my font displays depending on which method of font definition I use:

@font-face {url('https:/https://fonts.googleapis.com/...');}

@font-face

or

@import url('https:/https://fonts.googleapis.com/...')

@import

with the @import I've got a lighter version of the font and with the @font-face method it is a bit bolder.

Can anyone tell me why this happens, what the differences between the 2 "methods" are, and which is more advisable (advantages vs disadvantages).

font-face import css
1 Answers

Usually, @font-face is used to declare fonts that were downloaded and @import is for adding another stylesheet file. I would say that it could be related to font-weights. Because @font-face is creating the font that is downloaded it may be the problem. Does the google fonts link contain the font-weights?

user_71061090
Related