ios、android 系统字体说明

后来了解到的手机系统 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 */

   }

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

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

ios 系统

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

android 系统

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

winphone 系统

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

附：ios7字体列表

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

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

有关衬线字体和无衬线字体的差别，参考下图：

那么，使用系统默认的字体所达到的视觉效果跟使用微软雅黑字体没有明显的差别，权衡利弊，最终说服了产品经理放弃使用微软雅黑的想法。

结论

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

代码：


1

2

/*
移动端定义字体的代码 */

body{font-family:Helvetica;}

　　

ps:另外关于移动端的字体单位，rem是相当好用的，也给大家推荐一下，具体使用看这里：http://ued.taobao.org/blog/2013/05/rem-font-size/

时间： 2024-07-28 23:15:52

ios、android 系统字体说明的相关文章

Android系统字体规范

我们在做Android移动APP设计的时候,字号的选择也是很让人头疼,转载一份有关Android系统字体规范,如果在做Android项目的用户应该看看,如果有任何建议欢迎在留言处与我们交流探讨. 主要从以下几点做了分析: 移动设计中与字号有关的基本概念 Android系统默认字体及字号 Android字体单位sp与px的换算 规范字号的意义 印刷业的规范字号的用法 Android规范字号的近似用法 如何向前端输出? 如何在photoshop里选择字号? 1. 移动设计中与字号有关的基本概念 px

怎样改动android系统字体大小

改动字体大小的方法是运用到一个ActivityManagerNative类 首先先在代码宣告 private Configuration mconfig = new Configuration(); 并在代码中设置要改变字体大小的值 mconfig.fontScale = 0.75f;//默觉得1.0f 另外.还须要在AndroidManifest.xml中加上 android:configChanges="fontScale" 而在展讯平台,预设字体大小 超大: 1.3f 大:1.1

如何修改android系统字体大小

修改字体大小的方法是运用到一个ActivityManagerNative类 首先先在代码宣告 private Configuration mconfig = new Configuration(); 并在代码中设置要改变字体大小的值 mconfig.fontScale = 0.75f;//默认为1.0f 另外,还需要在AndroidManifest.xml中加上 android:configChanges="fontScale" 而在展讯平台,预设字体大小 超大: 1.3f 大:1.1

(原) Jquery 判断移动设备是IOS / Android系统

1 var u = navigator.userAgent; 2 var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端 3 var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端 4 alert('是否是Android:'+isAndroid); 5 alert('是否是iOS:'+isiOS);

显示iOS所有系统字体

源码地址: https://github.com/YouXianMing/FontList 效果图: 便于你开发中寻找适合自己的字体, demo中用到了 UITableViewHeaderFooterView 以及 隐藏了状态栏. [[UIApplication sharedApplication] setStatusBarHidden:YES withAnimation:UIStatusBarAnimationNone];

iOS 打印系统字体

1 NSArray * array = [UIFont familyNames]; 2 3 for( NSString *familyName in array ){ 4 printf( "Family: %s \n", [familyName UTF8String] ); 5 NSArray *fontNames = [UIFont fontNamesForFamilyName:familyName]; 6 for( NSString *fontName in fontNames )

为什么ios系统比android系统更为流畅

1优先级别不同:iOS最先响应屏幕 不少人都反应苹果iPhone要比一般Android手机流畅,这是一个现象要说是大问题谈不上,毕竟两者是完全两个不同的系统所以严格来说放在一起对比是不公平的.不过因为Android以及iOS是当下两大主流操作系统,对比抗衡之类的说法自然难以避免.今天我们就来谈谈为什么iOS产品在使用过程中会让人觉得更加流畅一些,而为何一些Android手机则容易出现卡顿延迟的情况. iOS手机为什么比安卓流畅 优先级别不同:iOS最先响应屏幕 当我们使用iOS或者是Androi

iOS vs Android 系统架构

iOS是基于UNIX内核,Android是基于Linux内核,iOS和android作为两款优秀的手机操作系统,他们有共性有区别. iOS的系统架构 分为四个层次: 核心操作系统层(Core OS layer) 核心服务层(Core Services layer) 媒体层(Media layer) 可触摸层(Cocoa Touch layer) 如下如所示: iOS系统架构解析: 1.Core OS是位于iOS系统架构最下面的一层是核心操作系统层,它包括内存管理.文件系统.电源管理以及一些其他的

Unity获取Android和iOS手机系统电量及网络状况

最开始考虑使用中间静态链接库来调用手机系统自带的API,但是在研究的过程中发现Android系统将电量等信息记录在了固定的文件中,所以只需要在C#中直接读取就可以而不需要中间库. a.Android版 1.通过C#直接读取,下面的GetBatteryLevel()方法 int GetBatteryLevel() { try { string CapacityString = System.IO.File.ReadAllText("/sys/class/power_supply/battery/c