本地安装的TTF会覆盖Google字体

时间:2012-02-23 19:48:30

标签: css fonts google-font-api

我正在使用Google字体中的Ubuntu字体:

<link href='http://fonts.googleapis.com/css?family=Ubuntu:300,400,300italic,400italic,500,500italic,700,700italic' rel='stylesheet' type='text/css' />

我的样式表:

body {
    font-family: 'ubuntu',arial;
}

它可以工作,但是如果安装一个具有相同名称的字体(Ubuntu),它将覆盖来自Google字体的字体。

是否可以强制浏览器使用Google字体中的那个?

1 个答案:

答案 0 :(得分:11)

答案不在于你的代码,而在于谷歌。

以下是您要求的CSS的一部分:

@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: bold;
  src: local('Ubuntu Bold'), local('Ubuntu-Bold'), url('http://themes.googleusercontent.com/static/fonts/ubuntu/v4/0ihfXUL2emPh0ROJezvraLO3LdcAZYWl9Si6vvxL-qU.woff') format('woff');
}

此处的关键行是local('Ubuntu Bold'),如果可能请求加载本地文件。 最简单的解决方案是复制所有Google的CSS,将其粘贴到您自己的CSS中,然后将此local名称修改为local('Ubuntu Bold NonExisting Name or Something Else')。此类字体不存在,不会替换CSS加载的字体。

P.S。我自己没有测试过。如果0ihfXUL2emPh0ROJezvraLO3LdcAZYWl9Si6vvxL-qU.woff网址即将到期,那么您就处于困境。尝试查看字体的许可证并考虑自己托管字体,如果防止本地覆盖是优先考虑的事。