使用第三方平台转换字体文件为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. intellij idea里神坑的@autowire

    当你写完项目的时侯serviceimpl层下的@autowire->对应的是dao层的注入,其下面会出现一条红线 在Intellij Idea开发工具在@Autowired或者@Resource ...

  2. XHR的应用场景

    一.简史 IE5.5最早实现XHR,需要通过ActiveXObject创建xhr实例,直到IE7才定义了XMLHttpRequest对象.IE5.5实现XHR之后,其他浏览器紧随其后实现了XHR,直接 ...

  3. angular2-响应式表单

    响应式表单是同步的.模板驱动表单是异步的.这个不同点很重要 使用响应式表单,我们会在代码中创建整个表单控件树. 我们可以立即更新一个值或者深入到表单中的任意节点,因为所有的控件都始终是可用的. 模板驱 ...

  4. Fiddler-修改HTTP请求参数

    在进行 App 测试时,经常需要修改请求参数,以获得不同的显示效果,以查看相应的页面显示处理.例如:可以通过修改 HTTP请求 的参数,来获取不同的响应结果. 下面以修改 HTTP请求的商品系统编号为 ...

  5. HQL(Hibernate Query Language)

    1. NativeSQL > HQL > EJB QL(JP QL 1.0) > QBC(Query By Criteria) > QBE(Query By Example)2 ...

  6. 关于scheduleAtFixedRate方法与scheduleWithFixedDelay的使用

    一.scheduleAtFixedRate方法 该方法是ScheduledExecutorService中的方法,用来实现周期性执行给定的任务,public ScheduledFuture<?& ...

  7. FlexPaper实现文档在线浏览(附源码)

    园子里也有关于FlexPaper的文章,但都不怎么详细. 没有较全的参数说明.就连官方网站都没有.没法,最后只得将swf文件反编译后查看了源码才将里面的参数全部弄出来. 好了,废话不多说,开始正题. ...

  8. C# WinForm 程序免安装 .NET Framework(XP/win7/win10环境运行)

    前文 首先感谢群里的大神宇内流云 提供的anyexec for windows版本. 经过本人搭建虚拟机在xp环境 使用anyexec运行winfrom程序后,测试通过,如下是用的xp运行winfro ...

  9. Angular 5.x 学习笔记(1) - 模板语法

    Angular 5.x Template Syntax Learn Note Angular 5.x 模板语法学习笔记 标签(空格分隔): Angular Note on github.com 上手 ...

  10. Facebook 新开源了 2 个东西,一个语音识别系统(wav2letter++)和一个机器学习库(flashlight)

    Open sourcing wav2letter++, the fastest state-of-the-art speech system, and flashlight, an ML librar ...