font-family 属性设置文本的字体系列。

font-family 属性应该设置几个字体名称作为一种"后备"机制,如果浏览器不支持第一种字体,他将尝试下一种字体。

注意: 如果字体系列的名称超过一个字,它必须用引号,如Font Family:"宋体"。

多个字体系列是用一个逗号分隔指明:

实例

p{font-family:"Times New Roman", Times, serif;}

如何在css中引入外部字体

css引入外部字体包的方法

@font-face{
font-family: 'oswald';
src : url('..//fonts/oswald.regular.ttf');
}

引入这个字体

.fontFail {
font-family: oswald;
}

数字使用oswald字体,中文使用思源

body{
font-family: "oswald", "SourceHanSansSC-Light","Source-Han-Light","Source Han Sans CN","SourceHanSansCN-Light","webfontSourceHanSansSC" !important
} / oswald字体只有数字和英文,所以汉字就默认使用下面的字体(思源字体) / "SourceHanSansSC-Light","Source-Han-Light","Source Han Sans CN","SourceHanSansCN-Light"
/ 这个是思源字体的不同写法,为了兼容不同浏览器可以识别该字体 / "webfontSourceHanSansSC" 这个就比较厉害了。 是上面字体包的引用。
如果前面的字体就没找到,就下载这个字体使用。
字体也可以引用不同的文字格式
@font-face {
font-family: "SourceHanSansCN-Light";
src: url("../font/SourceHanSansCN-Light.otf"),
url("../font/SourceHanSansCN-Light.ttf");
font-family: "SourceHanSansCN-Normal";
src: url("../font/SourceHanSansCN-Normal.otf");
font-family: "SourceHanSansCN-Regular";
src: url("../font/SourceHanSansCN-Regular.otf");
}


css之字体的引用的更多相关文章

  1. CSS中文字体对照表

    http://hotoo.googlecode.com/svn/trunk/labs/css/css-fonts.html CSS中文字体对照表 css字体名可以使用2种Unicode格式,以“微软雅 ...

  2. [css] 浏览器字体和css设置字体之间的关系

    原文链接:http://www.zhangxinxu.com/wordpress/2010/06/%E5%8F%AF%E7%94%A8%E6%80%A7%E4%B9%8B%E6%B5%8F%E8%A7 ...

  3. CSS定义字体间距 字体行与行间距

    CSS定义字体行间距 line-height:xxpx; CSS定义字体间距 下面我们讲述一下CSS的文本属性,还是先来看一下文本属性的详细列表: 属性     属性含义     属性值 Word-s ...

  4. css中文字体乱码解决方案

    css中文字体乱码解决方案:把css编码和html页面编码统一起来.如果html页面是utf-8.css.js也统一成utf-8编码.还有一个避免中文乱码的办法就是把中文字体写成英文来表示 css中文 ...

  5. CSS中文字体的英文名称(simsun)宋体,(Microsoft YaHei)微软雅黑

    CSS中文字体的英文名称(simsun)宋体,(Microsoft YaHei)微软雅黑 华文细黑:STHeiti Light [STXihei] 华文黑体:STHeiti 华文楷体:STKaiti ...

  6. css 中文字体 unicode 对照表

    css 中文字体可以用 unicode 格式来表示,比如“宋体”可以用 \5B8B\4F53 来表示.具体参考下表: 中文名 英文名 unicode 宋体 SimSun \5B8B\4F53 黑体 S ...

  7. css页面字体替换源代码和页面显示不一样问题解决

    2018年8月27日19:58:12 css指定字体的时候,可以自制的字体,比如字符替换,比如 0没有被替换,其他在源代码被替换对应的字母,但是现实的时候在替换成正确的数字 很简单,防爬虫,但是... ...

  8. 【css】css 中文字体 unicode 对照表

    css 中文字体可以用 unicode 格式来表示,比如“宋体”可以用 \5B8B\4F53 来表示.具体参考下表: 中文名 英文名 unicode 宋体 SimSun \5B8B\4F53 黑体 S ...

  9. html 如何访问 jar 包里面的静态资源(js、css、字体等)

    前言:最近两天在尝试写一个工具 jar 包,里面包含后台处理的 java 代码,包含前端 html.js.css.字体文件等,过程中解决了访问 jar 包里的静态资源问题,所以记录下来. 附:自己的一 ...

随机推荐

  1. AI MobileNet

    MobileNet,是针对移动和嵌入式设备的一类高效模型,基于流线型(streamlined)架构,使用深度可分离卷积(depthwise separable convolution)来构建轻量级深度 ...

  2. 《通过C#学Proto.Actor模型》之Persistence

    Actor是有状态的,当每一步执行失败后,返回失败地方继续执行时,希望此时的状态是正确的,为了保证这一点,持久化就成了必要的环节了. Proto.Actor提供了三种方式执久化: Event Sour ...

  3. java8 Lambda表达式的新手上车指南(1)--基础语法和函数式接口

    背景 java9的一再推迟发布,似乎让我们恍然想起离发布java8已经过去了三年之久,java8应该算的上java语言在历代版本中变化最大的一个版本了,最大的新特性应该算得上是增加了lambda表达式 ...

  4. 一篇博客带你入门Flask

    一. Python 现阶段三大主流Web框架 Django Tornado Flask 对比 1.Django 主要特点是大而全,集成了很多组件,例如: Models Admin Form 等等, 不 ...

  5. Python exe2shellcode,shellcode2exe

    exe2shellcode #! /usr/bin/env python # -*- coding: utf-8 -*- import os import sys def payload(files) ...

  6. Linux Redhat 7.6 操作系统 下载安装详解

    redhat 系统镜像分享 [百度网盘分享] (https://pan.baidu.com/s/1ALM6v1dAtPwmEt2tmyTghg ) 提取码:2i4o redhat 7.6版本安装详解 ...

  7. idea打开项目,没有项目文件,文件报红

    删除项目文件夹中的.idea文件,重启idea,再执行如下操作.

  8. python之序列化模块、双下方法(dict call new del len eq hash)和单例模式

    摘要:__new__ __del__ __call__ __len__ __eq__ __hash__ import json 序列化模块 import pickle 序列化模块 补充: 现在我们都应 ...

  9. mpvue——动态渲染echarts图表

    前言 使用mpvue-echarts来写图表,那个F2再提醒自己下要踩坑不能忘记.遇到了一个问题就是数据不能动态的去渲染,这个其实官方给了我们对应的方法 懒加载 代码 修改了调用initChart() ...

  10. CF95C Volleyball

    题意翻译 给出一个图,双向边,边上有权值代表路的距离,然后每个点上有两个值,t,c,t代表能从这个点最远沿边走t,且不能在半路下来,花费是c 现在告诉你起点终点,问最少的花费 点个数1000,边个数1 ...