http://www.fontsquirrel.com/tools/webfont-generator        ttf格式的字体转换成其他格式的字体
 
css引入特殊字体建议只是用英文字体,中文字体太大不适合.
在CSS中通过@font-face属性来实现网页中嵌入特殊字体.
首先获取要使用字体的三种文件格式 .EOT , .TTF 或 .OTF , .SVG , 确保能在主流浏览器中都能正常显示该字体.
.EOT,适用于Internet Explorer 4.0+
.TTF.OTF,适用于Firefox 3.5 , Safari , Opera
.SVG适用于Chrome , IPhone
最常见的是.TTF文件,我们需要通过这种文件格式转换为其余两种文件格式.
http://www.fontsquirrel.com/fontface/generator提供的在线字体转换服务获取字体文件格式的转换.
在css中进行如下声明:
 @font-face {
font-family: 'fontNameRegular';
src: url('fontName.eot');
src: local('fontName Regular'),
local('fontName'),
url('fontName.woff') format('woff'),
url('fontName.ttf') format('truetype'),
url('fontName.svg#fontName') format('svg');
}
/*其中fontName替换为你的字体名称*/ /*在css中使用这个字体*/
h1{font-family: fontNameRegular}

css引入特殊字体的更多相关文章

  1. CSS引入外部字体方法,附可用demo

    有时候我们做的页面需要用到一些更好看的字体又不想用图片代替,图片会影响加载速度则使用外部字体来显示但是直接通过font-family又不一定全部都行这就需要我们在css中进行定义并且引入字体文件路径然 ...

  2. 中文字体压缩器-解决css引入的字体太大的问题

    字蛛是一个中文字体压缩器 官方网站:http://font-spider.org/index.html 用于解决页面引入的css字体过大的问题 使用方法: npm i -g font-spider 在 ...

  3. css引入本地字体

    1.首先创建一个字体 @font-face { font-family: 'number_font'; //创建一个number_font字体名称 src: url('../../../style/F ...

  4. CSS引入本地字体与在线字体

    有些时候为了强调某些文字,需要使用一些比较特别的字体,CSS中现在也可以比较方便的引入字体了,如下: /* 定义字体 */ @font-face{ font-family: Arista2; src: ...

  5. css引入第三方字体

    上面图片时将字体文件放入到fonts文件夹内, 里面有一个fonts.css文件,将字体文件声明好, 然后像下面图片一样,在另外一个css内@import引入,(当然,也可以直接将声明和引用放在一个c ...

  6. css引入外部字体使网站字体更美观

    @font-face{font-family: myFont;src:url("../font/timesi.ttf");src:url("../font/timesbi ...

  7. CSS引入外部字体

    @font-face {    font-family: '综艺体';    font-style: normal;    font-weight: normal;    src: url(../cs ...

  8. 不同浏览器css引入外部字体的方式

    /** * 字体后缀和浏览器有关,如下所示 * .TTF或.OTF,适用于Firefox 3.5.Safari.Opera * .EOT,适用于Internet Explorer 4.0+ * .SV ...

  9. CSS引入字体文件

    在css引入字体文件可以直接把以下代码复制到css文件中 /* 字体声明 */ @font-face {font-family: 'icomoon';src: url('fonts/icomoon.e ...

随机推荐

  1. Java集合类——Set、List、Map、Queue接口

    目录 Java 集合类的基本概念 Java 集合类的层次关系 Java 集合类的应用场景 一. Java集合类的基本概念 在编程中,常需要集中存放多个数据,数组是一个很好的选择,但数组的长度需提前指定 ...

  2. node.js常用的fs文件系统

    fs文件系统模块对于系统文件及目录进行一些读写操作. 模块中的方法均有异步和同步版本,例如读取文件内容的函数有异步的 fs.readFile() 和同步的 fs.readFileSync(). 异步的 ...

  3. git merge最简洁

    一.开发分支(dev)上的代码达到上线的标准后,要合并到 master 分支 git checkout devgit pullgit checkout mastergit merge devgit p ...

  4. ThinkPHP框架介绍

    什么是框架 php框架是许多代码的集合,这些代码的程序结构的代码(并不是业务代码)代码中有许多的函数,类,功能类包 不使用框架开发的缺陷 代码编写不规范 牵一发而动全身 不能很好满足客户各方面的需求 ...

  5. 深入理解is_callable和method_exists

    一.函数解析 is_callable() 定义: (PHP 4 >= 4.0.6, PHP 5, PHP 7) is_callable — 检测参数是否为合法的可调用结构 bool is_cal ...

  6. phpstorm代码提示不小心关了,如何开启

    在phpstrom右下角单击如图 ​ 出现event log窗口 ​ 如果不是​ 单击切换取消节电模式即可开启代码提示.

  7. Python学习:2.Python集成学习环境(IDE)Pycharm的安装配置以及激活方

    一.下载Pycharm Pycharm作为Python现在最流行的集成开发环境,我们今后的Python的学习也就使用Pycharm进行,那今天我们就讲一下Pycharm的安装配置以及激活 1.我们首先 ...

  8. 文件 I/O缓冲流

    import java.io.File; import java.io.Writer; import java.util.StringTokenizer; import java.io.Reader; ...

  9. 最短路径算法 1.Floyed-Warshall算法

    这几周开始正式系统学习图论,新学期开始新的记录.由于二模和生物地理两门高考的临近,时间比较仓促,所以暂时跳过图论的(一)和(二),即图的储存和遍历.从最短路径算法学起,首先要学习的是Floyed-Wa ...

  10. spring boot踩坑记

    Resolved exception caused by handler execution: org.springframework.http.converter.HttpMessageNotWri ...