利用CSS3 [font-face]自定义网站字体

通过CSS3新增属性Font-face, 网页设计师可以使用任何喜欢的字体,只需要将字体上传到服务器上,从而避免使用图片代替。

支持CSS3 @font-face属性的浏览器有:Safari,Firefox,Chrome,Opera

预览:利用CSS3 [font-face]自定义网站字体

使用方法:

@font-face {font-family: 字体名称; src: url('字体路径');}

CSS代码:

@font-face {font-family: aller-display; src: url('aller-display.ttf');}
div {font-family: aller-display; font-size: 2em;}  

HTML代码:

<div>this is a custom font named aller display</div> 

下载:利用CSS3 [font-face]自定义网站字体

标签:
除非注明,本博客文章均为原创,转载请以链接形式标明本文地址
原创文章如转载,请注明:转载自 任鸟飞网页设计 [ http://www.renniaofei.com/ ]
本文链接地址: http://www.renniaofei.com/code/using-css3-font-face-to-add-custom-fonts-to-your-website/
引用通告地址 Trackback URL:直接在本文链接地址后添加 trackback/
任鸟飞

任鸟飞网页设计网创办者 主要关注网页设计,网站建设,图形图像设计。 Twitter @renniaofei QQ:29900684

1 个评论

  1. 一米 says:

    找这个字体,找到这里了,嘿嘿。

发表评论

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

*

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