使用第三方平台转换字体文件为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. 什么是图像 -- opencv基础

    opencv基础篇--到底什么是图像 什么是图像?英语中有两个单词来形容图像,一个是picture,一个是image.这两者虽然是形容同一个东西,但却又有着区别.picture代表实而有物的真实图像: ...

  2. FreeSwitch无法启动,提示进程pid锁定的解决方法

    来源:https://stackoverflow.com/questions/12817232/how-do-i-call-a-local-softphone-on-freeswitch error ...

  3. scss-null在@mixin传参中的应用

    可以给混合器声明参数,以便灵活的配置相关属性值,看如下scss代码: @mixin antzone-div($color, $font-size) { color:$color; font-size: ...

  4. html网页访问WebAPI中的方法遇到的问题

      1.移动端访问远程服务时,建议使用WebAPI 2.用不同浏览器访问WebAPI时返回的文本格式是不同的,Chrome Firefox将在浏览器中以XML形式显示此列表,IE浏览器将获得Json格 ...

  5. OLAP和数据挖掘的区别

    总结来说: 数据仓库提供了一个分析的数据源 数据挖掘能分析出未知的信息,提出假设 OLAP能通过分析,验证假设 从技术角度看,商务智能的过程是企业的决策人员以企业中的数据仓库为基础,经由数据挖掘工具. ...

  6. XP环境安装request包报错:离线安装packages: certifi urllib3 idna chardet

    分别下载 request certifi urllib3 idna chardet 安装包 数据包下载地址:https://pypi.org/ 解压到python安装目录 使用cmd命令进入..\py ...

  7. 第一次使用Git

    这次的作业是关于GIT的,一开始我并不知道GIT是啥,百度了一下才知道Git是一个开源的分布式版本控制系统,可以有效.高速的处理从很小到非常大的项目版本管理. Git 是 Linus Torvalds ...

  8. Jmeter入门11 使用Simple Controller组织接口测试用例

    接口测试实践中,可以使用Simple Controller来组织测试用例. 官网上说该控制器的主要用途用来组织采样器和其他的逻辑控制器等. 以下为一个接口测试项目结构示例: 1 测试计划 >添加 ...

  9. chrome不能用百度网盘极速上传插件的解决办法

    进入chorme设置中,选择隐私设置中的内容设置,插件>自动运行,然后管理例外情况>添加“[*.]baidu.com”,后边当然选择允许,然后重启浏览器,OK了

  10. ShellSort uva

    ShellSort He made each turtle stand on another one's back And he piled them all up in a nine-turtle ...