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中进行如下声明:
  1. @font-face {
  2. font-family: 'fontNameRegular';
  3. src: url('fontName.eot');
  4. src: local('fontName Regular'),
  5. local('fontName'),
  6. url('fontName.woff') format('woff'),
  7. url('fontName.ttf') format('truetype'),
  8. url('fontName.svg#fontName') format('svg');
  9. }
  10. /*其中fontName替换为你的字体名称*/
  11.  
  12. /*在css中使用这个字体*/
  13. 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. 关于python的GIL

    转自依云在知乎上的回答,链接为https://www.zhihu.com/question/27245271/answer/462975593 侵删. python的多线程,其实不是真的多线程,它会通 ...

  2. 精干货! Java 后端程序员 1 年工作经验总结

    一.引言   毕业已经一年有余,这一年里特别感谢技术管理人员的器重,以及同事的帮忙,学到了不少 东西.这一年里走过一些弯路,也碰到一些难题,也受到过做为一名开发却经常为系统维护 和发布当救火队员的苦恼 ...

  3. CSS基础全荟

    一.CSS概述 1.css是什么?? 层叠样式表 2.css的引入方式 1.行内样式   在标签上加属性style="属性名1:属性值1;属性名2:属性值2;..." 2.内嵌式  ...

  4. vuex组件 vuex-persistedstate

    vuex用于管理项目中的全局状态,但是我们一刷新vuex中保存的全局状态就会被全部初始化,虽然我们也可以同事缓存到storage中做两步操作,但是vuex-persistedstate组件已经帮我们完 ...

  5. python网络编程,通过服务名称和会话类型(tcp,udp)获取端口号,简单的异常处理

    作为一个php程序员,同时有对网络方面感兴趣,php就比较蛋疼了,所以就抽了些时间看python 之前学python基础因为工作原因,断断续续的看了个基础,差不多是可以写代码了 最近在看<pyt ...

  6. 分分钟教你学习GIt

    Git配置: $ git config --global user.name "awen" $ git config --global user.email "awen@ ...

  7. 在pythonanywhere上部署Django应用

    参考:https://tutorial.djangogirls.org/zh/deploy/ 资料讲的很明了,仅在设置上做几点补充. 1.设置相对路径 import os BASE_DIR = os. ...

  8. python的爬虫代理设置

    现在网站大部分都是反爬虫技术,最简单就是加代理,写了一个代理小程序. # -*- coding: utf-8 -*- #__author__ = "雨轩恋i" #__date__ ...

  9. c++ map的使用方法

    1.头文件:#include<map> 2.定义:map<typename1,typename2> mp 注:字符串数组只能用string而不能使用char[] 3.访问方式: ...

  10. 41-Individual authentication 模板

    1-创建项目,进入vscode控制台,输出如下命令, uld表示指定mssqllocaldb E:\coding\netcore>dotnet new mvc -au Individual -u ...