请选择 进入手机版 | 继续访问电脑版

Google Fonts API在线网页字体使用介绍

2017-9-16 15:59| 发布者: administrator| 查看: 411| 评论: 0 |原作者: 8531.org |来自: 8531.org


版权声明
本文首发于淄博网站建设 桑尼网络( http://8531.org/ ),版权所有。






   近日Google公布了Google Fonts API,只需在你的网页代码中添加一个<link>链接到Google字体库,就可以使用一系列自定义的字体,并且不需要你的用户预装这些字体。这些字体存储在Google的服务器,当然可以给我们节省一些流量,Google的链接速度那也是没得说的。另外可以毫不夸张地说,你可以在20秒内将这些字体应用到你的项目中。因为是在后端处理,所以这些字体能够支持到Internet Explorer 6,不必太在意浏览器兼容问题。目前Google Fonts API的字体数量还不是很多,并且都是英文字体,不过相信这个字体库会不断扩充的。闲话少说,下面演示一些如何使用这个API。

 

只需很简单的几步!


首先到Google Font Directory寻找你中意的字体

Google Font Directory

点击相应的字体,进入字体介绍页面:

Yanone+Kaffeesatz

     通过点击"Get the code"按钮可以得到该字体的使用方法。我们就用以上字体做个演示:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8">
<title>Google Fonts API</title>
<link href="http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz" rel="stylesheet" type="text/css">
<style type="text/css">
<!--
body { 
font-family: "Yanone Kaffeesatz", serif; font-size: 100px; 
}
-->
</style>
</head>
<body>
Hello World
</body>
</html>

     就这么简单,只需链接到http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz,font-family加上"Yanone Kaffeesatz",就可以使用Yanone+Kaffeesatz这个字体了,下面是以上代码的显示结果:

Google Font Directory Sample

 

<
>
 
QQ在线咨询
售前咨询热线
151-1700-0429
售后服务热线
131-5336-9354
返回顶部