如何在设置手机网页的字体不随着系统字体变化。@font-face

赵匡胤

如何在设置手机网页的字体不随着系统字体变化。

并不是随手机系统变化，而是手机不支持你使用的字体

你可以通过在web服务器里面添加CSS3 @font-face来引入字体，用户手机没有这个字体的时候就会去下载

http://www.w3cplus.com/content/css3-font-face

另外说一点，这个可能会影响页面的加载速度，影响用户体验，题主可以去看下各手机系统的默认字体，权衡利弊，或者找到一个合适的支持所有系统的字体

赵匡胤

@font-face是CSS3中的一个模块，他主要是把自己定义的Web字体嵌入到你的网页中，随着@font-face模块的出现，我们在Web的开发中使用字体不怕只能使用Web安全字体，你们当中或许有许多人会不自然的问，这样的东西IE能支持吗？当我告诉大家@font-face这个功能早在IE4就支持了你肯定会感到惊讶。我的Blog就使用了许多这样的自定义Web字体，比如说首页的Logo，Tags以及页面中的手写英文体，很多朋友问我如何使用，能让自己的页面也支持这样的自定义字体，一句话这些都是@font-face实现的，为了能让更多的朋友知道如何使用他，今天我主要把自己的一点学习过程贴上来和大家分享。

首先我们一起来看看@font-face的语法规则：

1、YourWebFontName:此值指的就是你自定义的字体名称，最好是使用你下载的默认字体，他将被引用到你的Web元素中的font-family。如“font-family:"YourWebFontName";”

2、source:此值指的是你自定义的字体的存放路径，可以是相对路径也可以是绝路径；

3、format：此值指的是你自定义的字体的格式，主要用来帮助浏览器识别，其值主要有以下几种类型：truetype,opentype,truetype-aat,embedded-opentype,avg等；

4、weight和style:这两个值大家一定很熟悉，weight定义字体是否为粗体，style主要定义字体样式，如斜体。

赵匡胤

html字体设置匹配移动端,移动端字体的设置

字体设置不建议使用中文字，而是使用Unicode码，这样做可以确保各个手机终端的兼容性。

例如：font:"宋体"，就要写为font:"\5B8B\4F53"。

另外，为了减少代码数量，降低手机端流量，字体定义最好整合来写。

例如：font:bold 14px/180% \5B8B\4F53;这段代码解析后为宋体粗体14号字1.8倍行距。

css字体编码：

中文名   |    英文名    |     Unicode     |    Unicode 2

Mac OS

华文细黑 STHeiti Light [STXihei] \534E\6587\7EC6\9ED1 华文细黑

华文黑体 STHeiti \534E\6587\9ED1\4F53 华文黑体

华文楷体 STKaiti \534E\6587\6977\4F53 华文楷体

华文宋体 STSong \534E\6587\5B8B\4F53 华文宋体

华文仿宋 STFangsong \534E\6587\4EFF\5B8B 华文仿宋

丽黑 Pro LiHei Pro Medium \4E3D\9ED1 Pro 丽黑 Pro

丽宋 Pro LiSong Pro Light \4E3D\5B8B Pro 丽宋 Pro

标楷体 BiauKai \6807\6977\4F53 标楷体

苹果丽中黑 Apple LiGothic Medium \82F9\679C\4E3D\4E2D\9ED1 苹果丽中黑

苹果丽细宋 Apple LiSung Light \82F9\679C\4E3D\7EC6\5B8B 苹果丽细宋

Windows

新细明体 PMingLiU \65B0\7EC6\660E\4F53 新细明体

细明体 MingLiU \7EC6\660E\4F53 细明体

标楷体 DFKai-SB \6807\6977\4F53 标楷体

黑体 SimHei \9ED1\4F53 黑体

宋体 SimSun \5B8B\4F53 宋体

新宋体 NSimSun \65B0\5B8B\4F53 新宋体

仿宋 FangSong \4EFF\5B8B 仿宋

楷体 KaiTi \6977\4F53 楷体

仿宋_GB2312 FangSong_GB2312 \4EFF\5B8B_GB2312 仿宋_GB2312

楷体_GB2312 KaiTi_GB2312 \6977\4F53_GB2312 楷体_GB2312

微软正黑体 Microsoft JhengHei \5FAE\x8F6F\6B63\9ED1\4F53 微软正黑体

微软雅黑 Microsoft YaHei \5FAE\8F6F\96C5\9ED1 微软雅黑

Office

隶书 LiSu \96B6\4E66 隶书

幼圆 YouYuan \5E7C\5706 幼圆

华文细黑 STXihei \534E\6587\7EC6\9ED1 华文细黑

华文楷体 STKaiti \534E\6587\6977\4F53 华文楷体

华文宋体 STSong \534E\6587\5B8B\4F53 华文宋体

华文中宋 STZhongsong \534E\6587\4E2D\5B8B 华文中宋

华文仿宋 STFangsong \534E\6587\4EFF\5B8B 华文仿宋

方正舒体 FZShuTi \65B9\6B63\8212\4F53 方正舒体

方正姚体 FZYaoti \65B9\6B63\59DA\4F53 方正姚体

华文彩云 STCaiyun \534E\6587\5F69\4E91 华文彩云

华文琥珀 STHupo \534E\6587\7425\73C0 华文琥珀

华文隶书 STLiti \534E\6587\96B6\4E66 华文隶书

华文行楷 STXingkai \534E\6587\884C\6977 华文行楷

华文新魏 STXinwei \534E\6587\65B0\9B4F 华文新魏