/**
* 字体后缀和浏览器有关,如下所示
* .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引入外部字体的方式的更多相关文章

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

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

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

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

  3. CSS引入外部字体

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

  4. 前端(css引入的3中方式)

    一.css引入的三种方式 行间式 在标签头部的style属性内 属性值满足的是css语法 属性值用key:value形式赋值,value具有单位 属性值之间用;隔开 外联式(企业开发中使用这种方式) ...

  5. css引入特殊字体

    http://www.fontsquirrel.com/tools/webfont-generator        ttf格式的字体转换成其他格式的字体   css引入特殊字体建议只是用英文字体,中 ...

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

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

  7. HTML引入外部字体

    HTML5如何引入外部字体 背景 现在我需要 "Montserrat-ExtraLight ExtraLight"类型的字体,但是html的font-family中找不到这个类型的 ...

  8. HTML: Css引入的四種方式

    哪四種?這裏簡單進行下總結 ①寫在 style 標籤中 <style type="text/css"> 這裏是css代碼... </style> ②外部引入 ...

  9. 006-CSS引入外部字体

    我们制作页面css,设置字体,可能会需要加入一些比较特殊的字体,这时候就需要引入这些字体. 方法如下: @font-face { font-family: KuTang;/*定义字体的名字*/ src ...

随机推荐

  1. 关于message pack as3 版本的一些修改。

    玩个人项目的时候,根据前辈的推荐开始用messagepack,分别是py版和as3版: 然后在github上找到了demonsters的as3模块,于是颠屁颠屁地拿来用了,用的时候发现了一些小地方过不 ...

  2. python常见异常及解决方法

    异常1: ValueError: unsupported hash type sha224 ERROR:root:code for hash sha256 was not found. Traceba ...

  3. canvas基本图形

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. sqlite配置下载安装教程

    安装教程 第一步: 首先去官网下载:https://www.sqlite.org/download.html 或直接下载:https://github.com/weibanggang/sqlite 下 ...

  5. 【题解】洛谷P2607【ZJOI2008】骑士

    洛谷P2607:https://www.luogu.org/problemnew/show/P2607 一道毒瘤的环基树问题 第一次做环基树的题目 刚看题目的时候觉得不就是跟没有上司的舞会一样嘛 然后 ...

  6. centos6: mysql+nginx+php

    安装配置: mysql: http://dev.mysql.com/doc/mysql-yum-repo-quick-guide/en/ yum repolist enabled | grep mys ...

  7. JS JavaScript中的文档碎片 DocumentFragement JS性能优化

    文档碎片是什么: 如果我们要在一个ul中添加100个li,如果不使用文档碎片,那么我们就需要使用append经常100次的追加,这会导致浏览器一直不停的渲染,是非常消耗资源的.但是如果我们使用文档碎片 ...

  8. sysdate 和 current_date 的区别

    在oracle中current_date与sysdate都是显示当前系统时间, 其结果基本相同,但是有三点区别: 1. current_date返回的是当前会话时间,而sysdate返回的是服务器时间 ...

  9. Spring Boot学习笔记(二二) - 与Mybatis集成

    Mybatis集成 Spring Boot中的JPA部分默认是使用的hibernate,而如果想使用Mybatis的话就需要自己做一些配置.使用方式有两种,第一种是Mybatis官方提供的 mybat ...

  10. springboot整合swagger笔记

    首先,在pom.xml中添加依赖 <!--swagger--> <dependency> <groupId>io.springfox</groupId> ...