郁闷吧 微信小程序 4188479 63242849 39070147 130690866
还没有任何记录...

懒人建站专注于网页素材下载,提供网站模板、网页设计、ps素材、图片素材等,服务于【个人站长】【网页设计师】和【web开发从业者】的代码素材与设计素材网站。

懒人建站提供网页素材下载、网站模板
这一切都是免费的!
当前位置:懒人建站 > div+css > css教程 >

手机移动端web字体设置经验分享

来源:未知 作者: 懒人建站 日期:2016-09-05 人气:
pc端web设计通常使用微软雅黑字体,但是在手机移动端并没有微软雅黑字体,微软雅黑字体并不适合移动端web页面开发,下面列出手机端安卓/IOS系统的自带字体作为参考:

pc端web设计通常使用微软雅黑字体,但是在手机移动端并没有微软雅黑字体,微软雅黑字体并不适合移动端web页面开发,下面列出手机端安卓/IOS系统的自带字体作为参考:

ios 系统自带字体

  • ios默认中文字体是STHeiti(苹果黑体)
  • ios默认英文字体是Helvetica
  • ios默认数字字体是HelveticaNeue
  • 无微软雅黑字体

android 系统自带字体

  • Android默认中文字体是Droidsansfallback(华文中宋)
  • Android默认英文和数字字体是Droid Sans
  • 无微软雅黑字体

winphone 系统

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

在ios和android和winphone做个测试

下图为测试机 iphone 4s、三星 GT-N7000 android 2.3.6、HTC windows Phone 8.0 三种手机中的默认中文字体和英文字体展现:

手机移动端web字体设置经验分享

我们可以看出三种不同的中文字体和微软雅黑一样是无衬线字体,有无衬线只是一个小原因,而无论页面中使用哪种字体,肉眼很难看出它们的差异,对产品的体验几乎没有影响。

使用系统默认的字体所达到的视觉效果跟使用微软雅黑字体没有明显的差别

结论

  • 各个手机系统有自己的默认字体,且都不支持微软雅黑
  • 如无特殊需求,手机端无需定义中文字体,使用系统默认
  • 英文字体和数字字体可使用 Helvetica ,三种系统都支持
  • 建议:英文和数字都设定为 Helvetica,因为在ios中默认的英文和数字是两种不同的字体,如果不设置成一种字体,显示效果不一样。

本文链接:手机移动端web字体设置经验分享http://www.51xuediannao.com/html+css/htmlcssjq/1034.html

手机移动端web字体设置经验分享由懒人建站收集整理,您可以自由传播,请主动带上本文链接

懒人建站就是免费分享,觉得有用就多来支持一下,没有能帮到您,懒人也只能表示遗憾,希望有一天能帮到您。

(责任编辑:懒人建站)

评论列表(网友评论仅供网友表达个人看法,并不表明本站同意其观点或证实其描述)
  • bird
    2016-11-10 19:22:07发表

    对吗?

  • bird
    2016-11-10 19:21:49发表

    对吗?