admin管理员组

文章数量:1584637

一直不知道手机端用的什么字体，只是觉得类似雅黑，直到有一次设计师问到设计移动web页面该用什么字体才严肃地想起这个问题。

前人已栽树，后人我就直接转来吧……

 

回想2年前刚开始接触手机项目，接到PSD稿后，发现视觉设计师们喜欢用微软雅黑作为中文字体进行设计，于是我写页面的时候也定义 font-family 为微软雅黑，后来发到线上后，细心的产品经理发现页面的字体不是微软雅黑，要求马上修改，我就惊呆了，还跟产品争执一番。

后来了解到的手机系统 ios、android 等是不支持微软雅黑字体，为了满足产品的需要，保证视觉稿的还原度，手机端是如何定义微软雅黑字体呢？

相信大家会想到 @font-face 定义为微软雅黑字体并存放到 web 服务器上，在需要使用时被自动下载

1 2 3 4 5 6 7 8 @font-face {      font-family:  'MicrosoftYaHei' ;      src: url( 'MicrosoftYaHei.eot' );  /* IE9 Compat Modes */      src: url( 'MicrosoftYaHei.eot?#iefix' ) format( 'embedded-opentype' ),  /* IE6-IE8 */               url( 'MicrosoftYaHei.woff' ) format( 'woff' ),  /* Modern Browsers */               url( 'MicrosoftYaHei.ttf' )  format( 'truetype' ),  /* Safari, Android, iOS */               url( 'MicrosoftYaHei.svg#MicrosoftYaHei' ) format( 'svg' );  /* Legacy iOS */     }

　　

有关 @font-face 的使用，大漠的这篇《CSS3 @font-face》有详细的介绍。

雅黑字体问题虽然解决了，但也带来了影响，一来消耗用户的流量，二来对页面的打开速度造成了延迟。

总感觉不好，为了说服产品经理，找了三大手机系统的字体资料： 

ios 系统

  • 默认中文字体是Heiti SC
  • 默认英文字体是Helvetica
  • 默认数字字体是HelveticaNeue
  • 无微软雅黑字体

android 系统

  • 默认中文字体是Droidsansfallback
  • 默认英文和数字字体是Droid Sans
  • 无微软雅黑字体

winphone 系统

  • 默认中文字体是Dengxian(方正等线体)
  • 默认英文和数字字体是Segoe
  • 无微软雅黑字体

通过对比发现，使用系统默认的字体所达到的视觉效果跟使用微软雅黑字体没有明显的差别。

结论

  • 各个手机系统有自己的默认字体，且都不支持微软雅黑
  • 如无特殊需求，手机端无需定义中文字体，使用系统默认
  • 英文字体和数字字体可使用 Helvetica ，三种系统都支持

代码：

1 2 /* 移动端定义字体的代码 */ body{font-family:Helvetica;}

      如果必须使用指定的字体的话，相信方法大家已经知道了，下面就是各种字体的来源问题了，刚开始去搜索各种字体时，确实费了一番功夫，要么就是太大，要么就是各种需要币，下面附上各种字体的下载地址，希望能对大家有所帮助。

字体大全下载地址：

造字工房字体打包 链接: http://pan.baidu/s/1pK8xpGZ 密码: m3wx
F开头shx字体CAD字体打包下载 链接: http://pan.baidu/s/1eS14rgY 密码: hgn7
B开头shx字体CAD字体打包下载 链接: http://pan.baidu/s/1i5vY3kh 密码: ys18
M开头shx字体CAD字体打包下载 链接: http://pan.baidu/s/1geMQHB9 密码: ewib
Z开头shx字体CAD字体打包下载 链接: http://pan.baidu/s/1hs10mX2 密码: x37e
5款昆仑字体打包下载 链接: http://pan.baidu/s/1bpc7U1p 密码: cr8j
古风字体包 链接: http://pan.baidu/s/1jIgxy0u 密码: 9j25
15款日本个性书法字体打包下载 链接: http://pan.baidu/s/1kUBTnBh 密码: supq
婚纱精美字体打包 链接: http://pan.baidu/s/1qXPqmHu 密码: mm76
4款文泉驿正体字体打包下载 链接: http://pan.baidu/s/1pLrI5lx 密码: xgjz
107款蒙纳中文简繁字体打包下载 链接: http://pan.baidu/s/1slmUK9Z 密码: papp
雅芳美工字体库打包下载 链接: http://pan.baidu/s/1jIAP8vs 密码: qas8
25款创艺字体打包下载 链接: http://pan.baidu/s/1dFkByiX 密码: qcvi
24款金桥中文字体打包下载 链接: http://pan.baidu/s/1bpmHsQV 密码: tu4u
77款经典字体打包下载 链接: http://pan.baidu/s/1i4Gbdjf 密码: bkue
128个迷你字体打包下载 链接: http://pan.baidu/s/1nuLsBbF 密码: gs3a
时装字体 链接: http://pan.baidu/s/1gfbJNRP 密码: sq9r
书体坊-颜真卿繁字体下载 链接: http://pan.baidu/s/1geRAzFP 密码: x4qc
电脑常用字体 链接: http://pan.baidu/s/1slQkv97 密码: 7k9v

地址来源：博客http://blog.sina/s/blog_131a8920b0102x7o1.html

本文标签： 字体下载地址

版权声明：本文标题：各种字体下载地址和移动端支持字体简析 内容由热心网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：https://www.elefans.com/dianzi/1727943445a1139102.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。