目前网页上使用的字体都是常见的几种,如’Lucida Grande’, Verdana, Arial, Sans-Serif,中文常见的有宋体。要想用比较个性的字体就比较麻烦了,因为你不能保证客户端是否支持这种字体,常用的方法是用Photoshop 把文字制作成图片。 为了让网页设计更加灵活,Google从2010年5月19日启动了网页在线字体服务,并一口气发布了十八字体族。但与 Monotype Web Fonts、FontShop 等字体商不同,Google 这次开放的字体与它其他很多服务一样,完全免费。
Google 目前提供的字体共有十八种,均为目前比较流行的免费字体,包括为 Android 而开发的 Droid 系列,被称为“Fonts for Scholars”的 Cardo,为代码印刷而设计的 Inconsolata,业余之作而不胫走红的 Yanone Kaffeesatz 等等,其中最能引人注目的是字体师 John Fell 设计的 IM Fell 字体。
我想每个网页设计师都会觉得这是个好消息,又一个来自Google的福音吧!
想使用它们吗?使用这些字体无需付费,也不必注册,只需要做简单的几步,举个例子,如果你想 在你的网页中使用“Tangerine”这种字体,
首先,在网页头部加入代码
- <link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Tangerine">
然后,在你的CSS样式表中加入类似:
- body {
- font-family: 'Tangerine', serif;
- font-size: 48px;
- }
上面是让页面所有元素的字体都变成Tangerine,如果只想局部显示Tangerine字体只要改变CSS选择器就可以了!
如果想详细的了解Google在线字体的话,请到官方主页http://code.google.com/webfonts
详 细使用方法http://code.google.com/apis/webfonts/docs/getting_started.html
原文来自淘 日本
竟然不知道Google还有这么一项服务,不过很可惜没有中文字体,因为大部分漂亮的中文字体都不是免费的,另外中文字体文件也比英文字体体积大了许多...
本站文章大部分为原创,用于个人学习记录,可能对您有所帮助,仅供参考!
江西省南昌市 1F
这么好的服务,可惜咱们大陆压力很大
浙江省宁波市 2F
现在上google都是网络链接重置。
黑龙江省牡丹江市 3F
css 还真不懂,的学学了。
黑龙江省哈尔滨市 4F
非常棒的功能
台湾省台北市 5F
请问板主,目前您部落格中的字体,是用google字体的方式吗?
还是用其他方式,才可以这么漂亮?
广东省深圳市 6F
咋就没有中文的啊,不过也挺好的,来给顶下啊
广东省 7F
体积太大是最重要的原因。我以前也想使用这种CSS方法定义字体效果,但是中文字体太大了,以微软雅黑为例,就有15M左右。而英文字体则只有几百KB。而且一些很好看的字体里面字库也不是很全,非常影响实际使用,只有挥泪放弃。
先定义font-family,例如:
/* @font-face {
font-family: “微软雅黑”;
src: url(“../fonts/msyh.ttf”) format(“truetype”);
}
/* @end */
然后就可以在下面的CSS中使用这种字体样式了,这样即使访客的电脑上没有微软雅黑字体,他也能看到微软雅黑字体样式的网页。但是中文使用这种的缺陷前面都说过了,所以悲催啊。有兴趣的朋友可以在本地测试一下,很给力的,很多很好看的字体应用在网页上效果不错。
广东省深圳市 B1
@ 雪狐 我就喜欢微软雅黑。
广东省深圳市 8F
不知道有没有微软雅黑。
湖南省郴州市 9F
这个非常好呀