关于中英文网站的字体设置,大家有神马高招

话说一个网站,其中有中文英文,想给中文设置“微软雅黑”,给英文设置“XXX”英文字体

但是有的地方的文字是中英文混合的,例如“芋头是个youtou,他现在在jiangsu……”

如果内容是后台录入,不方便单独给文字设置class……

大家有啥子办法让中英文应用到相应的字体呢

收藏 0分享浏览 1590
4年前
跟帖
前端乱炖
4年前

先设置中文字体,英文字体跟在后面即可。这样显示英文的时候,英文字体会覆盖掉中文字体

沙发
@前端乱炖 但是我要用自定义的字体@face 这样中英文字体似乎不能正常显示
板凳
hinotan
4年前
@前端乱炖 应该是反过来,自定义的英文字体在前,中文字体作为 fallback 在后
地板
小本堂
4年前

font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;

4 楼
hinotan
4年前

应该是反过来,自定义的英文字体在前,中文字体作为 fallback 在后。因为中文字体里带有英文字符,写在最前面的话,英文部分也会应用该中文字体,而不是被后面的字体覆盖。

举个栗子:

font-family: "proxima-nova", "Microsoft YaHei", "Hiragino Sans GB", sans-serif;

使用自定义的英文字体 Proxima Nova,中文则是 Windows 的雅黑或者 Mac 的冬青黑,最后 sans-serif 垫底。如果想提供特定的英文/中文备选字体,在首选后面加上就可以,但一定要英文在前中文在后,否则英文就白指定了。

5 楼
羽音篠之
4年前

关于字体的测试,我想以前好像看过一篇玉伯大大的详细论证, 具体的解决方案比较看好在 github 上的 fonts.css 项目

大家一起贡献代码吧!

有关字体的基本知识:

  • sans - 非等宽无衬线体(微软雅黑, Arial)
  • serif - 非等宽衬线体(宋体, Times New Roman)
  • monospace - 等宽字体(Courier New)
6 楼
说几句
广告位 点击查看投放指南

我的收藏