使用第三方平台转换字体文件为font-face所支持的格式。

TureTpe(.ttf)格式

  支持浏览器:IE9+,Firefox3.5+,Chrome4+,Safari3+,Opera10+,iOS Mobile Safari4.2+

OpenType(.otf) 格式

  支持浏览器:Firefox3.5+,Chrome4.0+,Safari3.1+,Opera10.0+,iOS Mobile Safari4.2+

Web Open Font Format(.woff) 格式

  支持浏览器:IE9+,Firefox3.5+,Chrome6+,Safari3.6+,Opera11.1+

Embedded Open Type(.eot)格式

  支持浏览器:.eot字体是IE专用字体,可以从TrueType创建此格式字体,支持这种字体的浏览器有【IE4+】

SVG(.svg) 格式

  Chrome4+,Safari3.1+,Opera10.0+,iOS Mobile Safari3.2+

引入字体

@font-face {  

     font-family: "FamilyName";  

     src: url("path.eot");  

     src: url("path/to/*.eot?#iefix") format("embedded-opentype"),   

     url("path/to/*.woff") format("woff"),   

     url("path/to/*.ttf") format("truetype"),   

     url("path/to/*.svg#FamilyName") format("svg");  

     font-weight: normal;  

     font-style: normal;  

     }  

    FamilyName 会在刚刚下载的文件中的css 文件中有,可以直接使用,不用在定义

使用字体

    直接 style="font-family:FamilyName" 或直接class 内定义使用到指定元素上。

      div{font-family:myFirstFont;}

												

@font-face css3自定义个性化字体的更多相关文章

  1. css3自定义placeholder字体颜色

    ::-webkit-input-placeholder{color:#f00;} ::-moz-placeholder{color:#f00;} :-moz-placeholder{color:#f0 ...

  2. css3 自定义字体的使用方法

    @font-face是CSS3中的一个模块,他主要是把自己定义的Web字体嵌入到你的网页中,随着@font-face模块的出现,我们在Web的开发中使用字体不怕只能使用Web安全字体,你们当中或许有许 ...

  3. Font Combiner – 自定义网页字体和图标生成工具

    Font Combiner 是一个功能丰富的 Web 字体生成工具和字体改进工具,提供字距调整.构造子集.各种提示选项和自定义字体字形组合.您可以生成您自己的自定义字体的格式和文件大小. 另外还有成千 ...

  4. CSS3文本与字体

    一.CSS3 换行 1.word-break(规定自动换行的处理方法) word-break: normal / break-all / keep-all; /* normal:使用浏览器默认的换行规 ...

  5. Android怎么使用字体图标 自定义FontTextView字体图标控件-- 使用方法

    首先我想说明一下字体图标的好处,最大的好处就是自适应了,而且是使用TextView 不用去切图,是矢量图 灵活调用 第一步我要说明一下一般字体图标的来源,我这里使用的是  --阿里巴巴矢量图标库 -网 ...

  6. css3文字与字体样式

    css3使用服务器端字体: <!DOCTYPE html> <html lang="en"> <head> <meta charset=& ...

  7. 3.css3文字与字体

    1.css3文字与字体: ①Font-size:大小. ⑴通常使用px.百分比.em来设置大小: ⑵xx-small.x-small.small.medium.large.x-large.xx-lar ...

  8. 利用private font改变PDF文件的字体

    利用private font改变PDF文件的字体 前几天做项目,需要使用未安装的字体来改变PDF的文件.以前并没有实现过类似的功能,幸运的是我在网上找到了类似的教程,并成功实现了这个功能. 下面就跟大 ...

  9. CSS SANS – 神奇!使用 CSS3 创建的字体

    在我们的认识中,CSS 所能做的就是改变网页的排版布局,调整字间距等.然而,这里我们要介绍的则是使用 CSS3 制作字体.CSS SANS 可以通过 CSS 技术创建的A-Z字体,一起来围观下. 在线 ...

随机推荐

  1. C# string Stream 互转

    使用C#将字符串转化成流,将流转换成字符串,代码如下: using System.IO; using System.Text; namespace CSharpConvertString2Stream ...

  2. Redis简介及持久化

    Redis是一个key-value数据库,他不仅性能强劲,而且还具有复制特性以及为解决问题而生的独一无二的数据模型.可用于缓存.消息队列.发布.订阅消息.商品列表和评论列表等场景.Redis提供了5种 ...

  3. Java中的锁之乐观锁与悲观锁

    1.  分类一:乐观锁与悲观锁 a)悲观锁:认为其他线程会干扰本身线程操作,所以加锁 i.具体表现形式:synchronized关键字和lock实现类 b)乐观锁:认为没有其他线程会影响本身线程操作, ...

  4. 如何查询日志文件中的所有ip,正则表达式

    IPV4必须满足以下四条规则: 1.任何一个1位或2位数字,即0-99: 2.任何一个以1开头的3位数字,即100-199: 3.任何一个以2开头.第2位数字是0-4之间的3位数字,即200-249: ...

  5. Java 的版本历史与特性

    Java SE 8[2014-03-14发行] Lambda表达式 Pipelines和Streams Date和Time API Default方法 Type注解 Nashhorn JavaScri ...

  6. vue——指令系统

    指令系统,可以联想咱们的cmd命令行工具,只要我输入一条正确的指令,系统就开始干活了. 在vue中,指令系统,设置一些命令之后,来操作我们的数据属性,并展示到我们的DOM上. 在vue中提供了一套为数 ...

  7. SQLAlchemy的使用---数据库的创建与连接

    # 1. 导入SQLAlchemy from sqlalchemy.ext.declarative import declarative_base from sqlalchemy import Col ...

  8. Angular6 基础(数据绑定、生命周期、父子组件通讯、响应式编程)

    Angular相比于vue来说,更像一个完整的框架,本身就集成了很多模块,如路由,HTTP,服务等,而vue是需要另外引入比如(vuex,axios等).Angular引入了依赖注入.单元测试.类等后 ...

  9. CSS的两种格式化上下文:BFC和IFC

    CSS的两种格式化上下文   文章包含很多个人理解,如果错误,欢迎指出~   在看本文之前,你要对CSS的盒子模型,Block-Level元素,Inline-Level元素有所了解,具体可参考CSS的 ...

  10. js实现螺旋纹理特效

    效果如下       实现代码如下: <!doctype html> <html> <head> <meta charset="UTF-8" ...