不同浏览器css引入外部字体的方式
/**
* 字体后缀和浏览器有关,如下所示
* .TTF或.OTF,适用于Firefox 3.5、Safari、Opera
* .EOT,适用于Internet Explorer 4.0+
* .SVG,适用于Chrome、IPhone
* 比如:
*/
@font-face {
font-family: 'MyFont';/*定义字体名称*/
src: url('fonts/hanshand-webfont.eot');
src: url('fonts/hanshand-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/hanshand-webfont.woff') format('woff'),
url('fonts/hanshand-webfont.ttf') format('truetype'),
url('fonts/hanshand-webfont.svg#webfont34M5alKg') format('svg');
font-weight: normal;
font-style: normal;
} /**
* 使用字体
*/
body {
font-family: 'MyFont', serif;
}
不同浏览器css引入外部字体的方式的更多相关文章
- CSS引入外部字体方法,附可用demo
有时候我们做的页面需要用到一些更好看的字体又不想用图片代替,图片会影响加载速度则使用外部字体来显示但是直接通过font-family又不一定全部都行这就需要我们在css中进行定义并且引入字体文件路径然 ...
- 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引入的3中方式)
一.css引入的三种方式 行间式 在标签头部的style属性内 属性值满足的是css语法 属性值用key:value形式赋值,value具有单位 属性值之间用;隔开 外联式(企业开发中使用这种方式) ...
- css引入特殊字体
http://www.fontsquirrel.com/tools/webfont-generator ttf格式的字体转换成其他格式的字体 css引入特殊字体建议只是用英文字体,中 ...
- 中文字体压缩器-解决css引入的字体太大的问题
字蛛是一个中文字体压缩器 官方网站:http://font-spider.org/index.html 用于解决页面引入的css字体过大的问题 使用方法: npm i -g font-spider 在 ...
- HTML引入外部字体
HTML5如何引入外部字体 背景 现在我需要 "Montserrat-ExtraLight ExtraLight"类型的字体,但是html的font-family中找不到这个类型的 ...
- HTML: Css引入的四種方式
哪四種?這裏簡單進行下總結 ①寫在 style 標籤中 <style type="text/css"> 這裏是css代碼... </style> ②外部引入 ...
- 006-CSS引入外部字体
我们制作页面css,设置字体,可能会需要加入一些比较特殊的字体,这时候就需要引入这些字体. 方法如下: @font-face { font-family: KuTang;/*定义字体的名字*/ src ...
随机推荐
- Ubuntu 16.04 源码方式安装 JDK
1.去官网下载JDK http://www.oracle.com/technetwork/articles/javase/index-jsp-138363.html 2.下载完成后,创建一个我们将要安 ...
- Makefile的变量赋值和函数
在Makefile中的定义的变量,就像是C/C++语言中的宏一样,他代表了一个文本字串,在Makefile中执行的时候其会自动原模原样地 展开在所使用的地方.其与C/C++所不同的是,你可以在Make ...
- 【luogu P2065 [TJOI2011]卡片】 假题解
题目链接:https://www.luogu.org/problemnew/show/P2065 辣鸡匈牙利,没有优化贼鸡儿慢 // luogu-judger-enable-o2 #include & ...
- 指令过滤器orderBy
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...
- android中的键值对
hashmap,contentvalue,namevaluepair,jsonobject ArrayList和HashMap的区别:内部元素:ArrayList储存的是单个对象(此对象是可以通过设置 ...
- Java笔试--代码纠错
package practice.javase; public abstract class Name { private String name; public abstract boolean i ...
- javascript跳转页面
<script type="text/javascript"> function openNewTab() { parent.addExampleTab({ id: a ...
- JSP的小心得
问题:Web容器(例如Tomcat)是怎么来执行jsp文件的? 首先它会将放在webapps目录下的jsp文件(这里以hello.jsp为例)翻译成hello_jsp.java文件并编译为hello_ ...
- python查找目录及子目录下特定文件
写这篇博客的缘由: 面试归来翻脉脉发现一个陌生的朋友提出一个面试题,设计实现遍历目录及子目录,抓取.pyc文件. 并贴出两种实现方法: 个人感觉,这两种方法中规中矩,不像是python的风格.pyth ...
- 3D Food Printing【3D食物打印】
3D Food Printing There's new frontier in 3D printing that's begining to come into focus: food. 3D打印的 ...