Welcome, Old Sport!

教你使用Google网页字体

by ilikecss ON 2012/09/05 27448

教你使用Google网页字体一些CSS初学者朋友经常会邮件问我一些特效里丰富多样的字体如何设置的,我回答他们这些都是Google的网页字体,在Google网页字体库里存放着大量各种形式的字体,当然这些都是英文的。我们经常看到国外网站上使用一些漂亮或奇形怪状的字体,这些在我们本地是没有的字体为何会显示出来呢?答案就是他们使用了Google网页字体。今天就教会你们使用,十分简单。

首先我们打开Google Web Fonts网站,在首页就可以看到许多字体,按下图操作进行。

如何使用google web fonts 步骤1

选择好字体后可以选择Review进行预览;选择Use进入操作界面。

如何使用google web fonts 步骤2

进入操作界面后你会看到4个步骤: 1. 选择字体的样式; 2. 选择字符集; 3. 添加代码到你的网站; 4. 添加CSS到你的网站; 选择代码提供三种方式: “CSS link插入”,”@import CSS(在CSS文件里调用)”, “脚本方式”,当然第一种是最简单的了。参考下图: (另外在操作界面右侧有显示页面调用这款字体的Load时间)

如何使用google web fonts 步骤3

至此,我们调用Google web fonts的教程就完成了,大家不妨亲手实践一下。

16条评论
  1. #1

    derrick说道:

    站点很不错,很多学习的。。支持下。

  2. 经常被墙,有点受不了。天朝啊~~

  3. #3

    塵清枫说道:

    好详细的说

  4. #4

    dsrzc.com.cn说道:

    这个讲的很详细啊

  5. 正好要做个英文博客

  6. #6

    你好先森说道:

    做设计的都比较强大,博主的网站创意十足

  7. #7

    schneider说道:

    见识了,学习了,谢谢博主! :smile:




TOP