GOOGLE网络字体加载器

时间:2015-11-01 16:17:41

标签: html css google-font-api typekit

我查了很多博客,但找不到我的问题的答案,目前我正在使用谷歌网络字体加载器从谷歌CDN异步加载字体,但是,我也在使用字体使用我的CSS中的@font face声明在服务器上本地存储。

是否可以将两者结合起来,即使异步脚本从CDN加载谷歌字体和本地字体(包括FALLback)

//这是我的HTML文件中的脚本

<script type="text/javascript">
      WebFontConfig = {
        google: { families: [ 'Merriweather:400,900italic,700italic,900,700:all' ] },
        custom: {
            families: ['Fira Sans'],
            urls: ['../assets/css/type.css']
        }
      };
      (function() {
        var wf = document.createElement('script');
        wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
          '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
        wf.type = 'text/javascript';
        wf.async = 'true';
        var s = document.getElementsByTagName('script')[0];
        s.parentNode.insertBefore(wf, s);
      })(); 
    </script>

    <noscript>
        <link href='http://fonts.googleapis.com/css?family=Merriweather:400,900italic,700italic,900,700&subset=all' rel='stylesheet' type='text/css'>
    </noscript>

//这是我的CSS文件中找到的本地字体声明

@font-face {
  font-family:'museo_sans300';
  src: url('museo/MuseoSans_300-webfont.eot?') format('eot'), url('museo/MuseoSans_300-webfont.woff') format('woff'), url('museo/MuseoSans_300-webfont.ttf') format('truetype');}

我想让这两个加载异步,甚至可能在将来包含typekit!

这可能吗?

非常感谢你的帮助

0 个答案:

没有答案