1.WEB字体可以使用一系列文件类型,下面介绍三种字体类型:

(1)内嵌OpenType

(2)TrueType和OpenType台式机使用的标准字体文件类型

(3)WEB开放字体格式。

2.构造子集:节省页面重量的一种方法是构造子集,构造子集是通过仅包含确定使用字符削减实际字体大小的方法。

3.在网站上使用Web字体有两种方式:自托管和Web字体服务。

(1)自托管Web字体来源于你自己的服务器,就像其他的资源一样。如果需要与字体相关的花费也是一次性的购买支出。

(2)Web字体服务:通常提供订购Web字体的方法。这种方式是按月或年支付使用字体的版权费用而不是彻底的买断字体。

4.使用Web字体设置文本样式:

(1)从下载的ZIP文件中的web fonts文件夹找到stylesheet.css文件。

(2)为常规文本准备的@font-face样式规则复制到你自己的样式中

(3)将字体文件复制到包含你样式表的文件夹中。

(4)对font-family进行重命名,让该名称成为字体的代号。

(5)使用你最熟悉的方法,创建为文本元素添加样式的规则。为应用Web字体,在样式规则中输入font-f:‘web font name’;其中的web font name是上一步骤创建的名字。

5.为Web字体应用斜体步骤:

(1)从下载的ZIP文件中的web fonts文件夹找到stylesheet.css文件。

(2)为常规文本准备的@font-face样式规则复制到你自己的样式中

(3)将斜体字体文件复制到包含你样式表的文件夹中。

(4)对font-family进行重命名,让该名称成为字体的代号。

(5)将斜体文本@font-face样式规则中的font-style值改为font-style:italic。

6.为Web应用粗体步骤:

(1)从下载的ZIP文件中的web fonts文件夹找到stylesheet.css文件。

(2)为常规文本准备的@font-face样式规则复制到你自己的样式中

(3)将斜体字体文件复制到包含你样式表的文件夹中。

(4)对粗体文本@font-face样式规则中的font-family值进行重命名,使之与针对常规文本的样式规则中的名称保持一致。

(5)将粗体文本@font-face样式规则中的font-weight值改为font-weight:bold。

7.为Web字体应用粗斜体的步骤:

(1)从下载的ZIP文件中的web fonts文件夹找到stylesheet.css文件。

(2)为常规文本准备的@font-face样式规则复制到你自己的样式中

(3)将斜体字体文件复制到包含你样式表的文件夹中。

(4)对粗斜体文本@font-face样式规则中的font-family值进行重命名,使之与针对常规文本的样式规则中的名称保持一致。

(5)将粗体文本@font-face样式规则中的font-weight值改为font-weight:bold,同时将斜体文本@font-face样式规则中的font-style值改为font-style:italic。

十三章:使用WEB字体的更多相关文章

  1. JavaScript高级程序设计:第十三章

    第十三章 一.理解事件流 事件流描述的是从页面中接收事件的顺序. 1.事件冒泡 IE的事件流叫做事件冒泡,即事件开始时由最具体的元素接收,然后逐级向上传播到较为不具体的节点.以下面的HTML页面为例: ...

  2. CSS3秘笈:第十二章&第十三章

    第十二章 1.网页布局类型 (1)固定宽度 (2)流式 (3)响应式Web设计 2.CSS布局的方法 通过给元素设置一个宽度,将它浮到左侧或右侧,就可以创建一个列(元素后面的文本会环绕浮动的元素,仿佛 ...

  3. 《汇编语言 基于x86处理器》第十三章高级语言接口部分的代码 part 2

    ▶ 书中第十三章的程序,主要讲了汇编语言和 C/++ 相互调用的方法 ● 代码,汇编中调用 C++ 函数 ; subr.asm INCLUDE Irvine32.inc askForInteger P ...

  4. 第二十三章 多项目集中权限管理及分布式会话——《跟我学Shiro》

    二十三章 多项目集中权限管理及分布式会话——<跟我学Shiro> 博客分类: 跟我学Shiro 跟我学Shiro  目录贴:跟我学Shiro目录贴 在做一些企业内部项目时或一些互联网后台时 ...

  5. 《深入浅出Node.js》第8章 构建Web应用

    @by Ruth92(转载请注明出处) 第8章 构建Web应用 一.基础功能 请求方法:GET.POST.HEAD.DELETE.PUT.CONNECT GET /path?foo=bar HTTP/ ...

  6. Monotype推出基于HTML5的Web字体平台

    著名字体公司Monotype近日宣布推出基于HTML5的Web字体平台,设计者可以访问近10万字体的目录. Monotype推出基于HTML5的Web字体平台 Monotype推出基于HTML5的We ...

  7. PRML读书会第十三章 Sequential Data(Hidden Markov Models,HMM)

    主讲人 张巍 (新浪微博: @张巍_ISCAS) 软件所-张巍<zh3f@qq.com> 19:01:27 我们开始吧,十三章是关于序列数据,现实中很多数据是有前后关系的,例如语音或者DN ...

  8. 如何把你的图标转换成web字体

    在这篇教程中,我们将使用一个免费的Web应用程序IcoMoon将矢量图转换成Web字体,然后将生成的字体通过css应用到Web页面中. 通常我们在网站中必不可少的会使用到一些小图标.在正常尺寸下,布局 ...

  9. <构建之法>第十三章到十七章有感以及这个项目读后感

    <构建之法>第十三章到十七章有感 第13章:软件测试方法有哪些? 主要讲了软件测试方法:要说有什么问题就是哪种效率最高? 第14章:质量保障 软件的质量指标是什么?怎么样能够提升软件的质量 ...

随机推荐

  1. Python编程工具IDLE快捷键

    IDLE编辑器快捷键 自动补全代码        Alt+/(查找编辑器内已经写过的代码来补全) 补全提示              Ctrl+Shift+space(默认与输入法冲突,修改之) (方 ...

  2. Devstack single node Installation on VM

    Last three days, I want to install devstack on my virtual machine on Vmware Workstation.The VM'syste ...

  3. javascript windows对象

    1.windows对象方法 2.计时器方法 3.计时器setInterval() <!DOCTYPE HTML> <html> <head> <meta ht ...

  4. maven创建spring项目之后,启动报错java.lang.ClassNotFoundException: org.springframework.web.context.ContextLoade

    错误: org.apache.catalina.core.StandardContext listenerStart严重: Error configuring application listener ...

  5. centsOS下安装vsftp的配置

    1. 添加用户组 # groupadd www 2. 修改配置 # vi /etc/vsftpd/vsftpd.conf 查找: #chroot_list_enable=YES #chroot_lis ...

  6. HDU 5860 Death Sequence

    用线段树可以算出序列.然后o(1)询问. #pragma comment(linker, "/STACK:1024000000,1024000000") #include<c ...

  7. 暑假集训2016day3T1 欧拉回路(UOJ #117欧拉回路)(史上最全的欧拉回路纯无向图/有向图解析)

    原题……可惜不会……真是一只大蒟蒻…… ———————————————————————————————— 有一天一位灵魂画师画了一张图,现在要你找出欧拉回路,即在图中找一个环使得每条边都在环上出现恰好 ...

  8. 草料生成app自动下载的二维码

    草料官网http://cli.im/app 填写iOS和安卓的appid就好了

  9. INSTALL_FAILED_NO_MATCHING_ABIS

    在运行写好的cocos的demo时候,安装出现以下问题: 后来发现是因为自己用cygwin生成的x86的.so文件跟自己的魅族3机器CPU不适配!!! 参考:http://stackoverflow. ...

  10. 老oj1965:polygon半平面交

    题目链接:http://192.168.2.240:8080/JudgeOnline/showproblem?problem_id=1965 polygon半平面交 Time Limit:1000MS ...