因为众所周知的缘由,国内使用google font库有很大的问题。css
解决方案1:使用国内镜像如360网站卫士经常使用前端公共库CDN服务前端
优势:使用方便api
缺点:目标用户包含国外的开发者,不清楚国外用户的加载速度字体
解决方案2:提供另一种解决方案,能够自主决定资源下载源,自主配置cdn等服务。网站
在google fonts 官网上选择字体并获取css连接,以下google
<link href='https://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>
将连接内容下载到本地保存,打开,内容以下:url
/* latin */ @font-face { font-family: 'Oswald'; font-style: normal; font-weight: 400; src: local('Oswald Regular'), local('Oswald-Regular'), url(https://fonts.gstatic.com/s/oswald/v10/pEobIV_lL25TKBpqVI_a2w.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000; } /* 以下可能还有更多代码,但结构是和上面的同样的 */
将 @font-face 下 src属性下 url 处的文件下载到本地并保存,并将 url 地址修改为本地地址code
引用修改后的本地google fonts css文件,就能够使用了。orm
参考资料:cdn