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引入特殊字体的更多相关文章
- CSS引入外部字体方法,附可用demo
有时候我们做的页面需要用到一些更好看的字体又不想用图片代替,图片会影响加载速度则使用外部字体来显示但是直接通过font-family又不一定全部都行这就需要我们在css中进行定义并且引入字体文件路径然 ...
- 中文字体压缩器-解决css引入的字体太大的问题
字蛛是一个中文字体压缩器 官方网站:http://font-spider.org/index.html 用于解决页面引入的css字体过大的问题 使用方法: npm i -g font-spider 在 ...
- css引入本地字体
1.首先创建一个字体 @font-face { font-family: 'number_font'; //创建一个number_font字体名称 src: url('../../../style/F ...
- CSS引入本地字体与在线字体
有些时候为了强调某些文字,需要使用一些比较特别的字体,CSS中现在也可以比较方便的引入字体了,如下: /* 定义字体 */ @font-face{ font-family: Arista2; src: ...
- css引入第三方字体
上面图片时将字体文件放入到fonts文件夹内, 里面有一个fonts.css文件,将字体文件声明好, 然后像下面图片一样,在另外一个css内@import引入,(当然,也可以直接将声明和引用放在一个c ...
- css引入外部字体使网站字体更美观
@font-face{font-family: myFont;src:url("../font/timesi.ttf");src:url("../font/timesbi ...
- CSS引入外部字体
@font-face { font-family: '综艺体'; font-style: normal; font-weight: normal; src: url(../cs ...
- 不同浏览器css引入外部字体的方式
/** * 字体后缀和浏览器有关,如下所示 * .TTF或.OTF,适用于Firefox 3.5.Safari.Opera * .EOT,适用于Internet Explorer 4.0+ * .SV ...
- CSS引入字体文件
在css引入字体文件可以直接把以下代码复制到css文件中 /* 字体声明 */ @font-face {font-family: 'icomoon';src: url('fonts/icomoon.e ...
随机推荐
- Java集合类——Set、List、Map、Queue接口
目录 Java 集合类的基本概念 Java 集合类的层次关系 Java 集合类的应用场景 一. Java集合类的基本概念 在编程中,常需要集中存放多个数据,数组是一个很好的选择,但数组的长度需提前指定 ...
- node.js常用的fs文件系统
fs文件系统模块对于系统文件及目录进行一些读写操作. 模块中的方法均有异步和同步版本,例如读取文件内容的函数有异步的 fs.readFile() 和同步的 fs.readFileSync(). 异步的 ...
- git merge最简洁
一.开发分支(dev)上的代码达到上线的标准后,要合并到 master 分支 git checkout devgit pullgit checkout mastergit merge devgit p ...
- ThinkPHP框架介绍
什么是框架 php框架是许多代码的集合,这些代码的程序结构的代码(并不是业务代码)代码中有许多的函数,类,功能类包 不使用框架开发的缺陷 代码编写不规范 牵一发而动全身 不能很好满足客户各方面的需求 ...
- 深入理解is_callable和method_exists
一.函数解析 is_callable() 定义: (PHP 4 >= 4.0.6, PHP 5, PHP 7) is_callable — 检测参数是否为合法的可调用结构 bool is_cal ...
- phpstorm代码提示不小心关了,如何开启
在phpstrom右下角单击如图 出现event log窗口 如果不是 单击切换取消节电模式即可开启代码提示.
- Python学习:2.Python集成学习环境(IDE)Pycharm的安装配置以及激活方
一.下载Pycharm Pycharm作为Python现在最流行的集成开发环境,我们今后的Python的学习也就使用Pycharm进行,那今天我们就讲一下Pycharm的安装配置以及激活 1.我们首先 ...
- 文件 I/O缓冲流
import java.io.File; import java.io.Writer; import java.util.StringTokenizer; import java.io.Reader; ...
- 最短路径算法 1.Floyed-Warshall算法
这几周开始正式系统学习图论,新学期开始新的记录.由于二模和生物地理两门高考的临近,时间比较仓促,所以暂时跳过图论的(一)和(二),即图的储存和遍历.从最短路径算法学起,首先要学习的是Floyed-Wa ...
- spring boot踩坑记
Resolved exception caused by handler execution: org.springframework.http.converter.HttpMessageNotWri ...