CSS字体引入格式

几个免费字体下载网站：

https://ztxz.org.cn/

https://font.chinaz.com/

https://www.foundertype.com/

 

一般下载下来是单个ttf或otf字体文件，很多都体积比较大，直接引入单个字体文件到CSS中会让网站加载满变卡顿，这时我们可以到https://transfonter.org/这个字体转换网站中将单个字体文件转换成多种格式组合，有svg、ttf、woff和woff2等

 

然后CSS引入

@font-face {
    font-family: '定义family名';
    src: url('字体名.woff2') format('woff2'),
        url('字体名.woff') format('woff'),
        url('字体名.ttf') format('truetype'),
        url('字体名.svg') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

*{
	font-family: '定义family名' !important;
}