css之字体的引用

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");
}

 

转载于:https://www.cnblogs.com/qdlhj/p/10598402.html