CSS 字体定义

字体定义属性 @font-face

加载自定义字体

@font-face {
  font-family: akrobat-bold;
  src: url('fonts/Akrobat-Bold.eot?#iefix'); /* IE9+ */
  src: url('fonts/Akrobat-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/Akrobat-Bold.ttf') format('truetype'), /* chrome, firefox... */
       url('fonts/Akrobat-Bold.otf');
}

IE浏览器只支持eot格式，否则报如下错误:

CSS3114: @font-face 未能完成 OpenType 嵌入权限检查。权限必须是可安装的。

幸好，大部分字体都支持互相转换，缺啥格式字体在线转换一下。

定义本地字体

由于平台的多样化，系统自带的字体有所差异，比如MAC常用的是萍方，而win7+常用微软雅黑，
还能解决字体名称不一致的问题，使用@font-face，就很方便解决这些问题。

@font-face {
  font-family: "PingFang SC Regular Web";
  src: local("PingFang SC Regular"),
       local("PingFangSC-Regular"),
       local("PingFang SC"),
       local("Microsoft Yahei");
}

/** 使用 **/
font-familty: "PingFang SC Regular Web";