css - mobile font setting problem

Question

It belongs to hybrid development. The page I write is nested in the native shell. The font I set does not take effect

body {
    font-family: -apple-system, BlinkMacSystemFont, "PingFang SC","Helvetica Neue",STHeiti,"Microsoft Yahei",Tahoma,Simsun,sans-serif;

}

Mainly because English is not a font that comes with the system.

Answer 1

body {
    font-family: -apple-system, BlinkMacSystemFont, "PingFang SC","Helvetica Neue",STHeiti,"Microsoft Yahei",Tahoma,Simsun,sans-serif;

}

According to the principle of font-family, if the client terminal does not recognize the previous font, it will automatically switch to the second font. If the second font is not recognized, it will switch to the third font, and so on. If it cannot recognize the previous font, it will call the default font.
According to the font calling principle of font-family, we can call different fonts for English, Chinese, and other two fonts for rendering.
For example: Arial, 'Times New Roman', these two fonts do not understand Chinese, only English, so , these two fonts can only render English numbers and some special symbols, and the Chinese on the page will automatically call the third font Microsoft YaHei (PS: If such a font exists).
So, when defining the font, The English fonts are written in front and the Chinese ones are written in the back. In this way, the system will automatically use fonts for the characters in order. If the current font does not support the text, it will automatically switch to the next font in the list.
If the font you set does not work, check the browser to see which font is displayed in English on the page.

Answer 2

If it does not take effect, there are many reasons and it is difficult to arrange;

And your font-family is such a long string of codes, which means that if the first font is not available, then the order is down

Did you say the font you set?

/face covering

Which font do you want?