特定字体未显示在Google Chrome上，但Safari可以

Question

I noticed I couldn't find the magnifier icon in computed panel of Chrome inspector at the day before yesterfay. Everything looks fine before that and fonts also can display on the browser normally.
What's going on with Google Chrome?

On chrome

On safari

Same css code but they are displayed with different fonts, one is "lanting hei" (on safari, right one), another is "Helvetica neue" (on chorme, wrong one)

Answer 1

You might not including ttf and woff font files. Try as described below-

@font-face {
    font-family: 'your-font-name';
    font-style: normal;
    font-weight: 400;
    src: url("/css/fonts/your-font-name.woff") format("woff");
 }

or you share your code first.

Answer 2

The issue is that you have this in your css

body{font-family: 'lanting hei';}

The font name the browser is looking for is 'lanting hei' instead of lanting hei (the difference being the quotes)

Change the css to

body{font-family: lanting hei;}