广告

使用Google Web Fonts API为您的网站添加字体

什么是Google Web Fonts API
Google Web Fonts(简称webfont)亦Google网页字体,网页字体的快速和易于使用的每个人,包括专业的设计师和开发商。我们认为,不应该有任何作出了巨大的网站障碍。
Google的目标是创建一个世界的核心Web字体的目录,并提供API服务,使任何人都可以带来质量的排版的网页。
API服务Google的服务器上运行。他们快速,可靠和测试。 Google提供免费的服务。它可以在几秒钟内的网站加入Google的Web字体。
网页字体建一个网站,是一个更美观,更具可读性,更容易和更加开放的网络。
所有的字体都是开源的。这意味着你可以自由与朋友和同事分享您的收藏夹。你甚至可以改善或定制,并与原设计者。您还可以使用在每一个您想要的方式,私人或商业 – 打印,您的计算机上,或在您的网站。
Google正与世界各地的设计师,出版质量为Web字体的设计。如果你设计的字体,想贡献自己的设计,请与我们联系。在目录中的字体,可以成为非常受欢迎,百万计的人们每天看到的。
有何作用?
通过添加Google提供个webfont相关代买在网页页头中就可以轻松的在网页CSS的font-family中使用相应的字体,解决了用户电脑中字体稀少以至于无法给您的网页带来最佳的浏览效果的难题.
使用方法
1.将Google提供的代码放置至网页页头中,并创建一个类.如:

101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
<html>
<head>
<meta charset="utf-8">
<link href='http://fonts.googleapis.com/css?family=Aldrich|Montez' rel='stylesheet' type='text/css'>
<style>
.myfont{font-family:'Montez';}
</style>
</link></meta></head>
<body>
<div class="myfont">
您好!Hello World!
ABCDEFGabcdefgHIJKLMNopqrstUVWXYZdfjdjtkJTKjktkljkljlkKJTL;WEU02156748ADFTYRETAEW
EWRWETWQRETWERYREJTIHQWRT4846423@#$$%$^&*(*&(*&()/*-+Z
</div>
</body>
</html>

显示的效果如下(为效果突出,故选择了一种很扭曲的字体):

您好!Hello World!
ABCDEFGabcdefgHIJKLMNopqrstUVWXYZdfjdjtkJTKjktkljkljlkKJTL;WEU02156748ADFTYRETAEW
EWRWETWQRETWERYREJTIHQWRT4846423@#$$%$^&*(*&(*&()/*-+Z
字体代码如何生成
1.访问 http://www.google.com/webfonts#ChoosePlace:select
2.进入以上页面后会看到很多字体,点击”Add To Collection”可以将字体加入字体集,添加完毕后,点击右下角的”USE”即可进入代码获取页面.如果只需要一种字体就直接点击”Quick-use”即可
3.点击USE进入代码获取页面后,该页面有提供字体的链接代码和字体的font-family属性值,请自行查看.
有何缺点
1.貌似只支持拉丁系字符,暂未支持中文.
2.建议不要添加太多字体在集合中,因为字体多自然加载的时间就翻倍了.

3 thoughts on “使用Google Web Fonts API为您的网站添加字体

发表评论

电子邮件地址不会被公开。 必填项已用*标注

您可以使用这些HTML标签和属性: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>