前言
今天想把自己新写的个人主页套上cdn,但是遇到了一个问题
这里可以看见,tff字体文件加载的确成功了,但是却因为跨域问题而不能载入
百度的方法很多需要涉及到修改nginx配置等,所以我解决一下不需要修改配置调用一个css即可解决的办法
方法
首先打开一个网站,这个网站可以把字体文件转换为base64码的css文件
这里简单解释一下需要用到的功能
- Add Fonts:添加字体文件
- Convert:开始转换
下方的选择配置中需要打开 Family support 与 Base64 encode
其中Family support默认是打开的,所以我们只需要打开Base64 encode的选项即可
然后上传需要的字体文件,这里我上传一个ttf格式的文件,上传后就可以点击转换按钮啦,单机转换
稍等片刻后,转换完成,单击Download下载转换后的文件
解压后会发现有这些文件,我们只需要拷贝stylesheet.css到自己网站的css目录就行,其他文件不需要,随意删除
然后打开这个文件,会发现有一对超级长的base64码,这个可以无视
现在要做的就是,让整个网站调用这个css文件来加载字体
我们打开stylesheet.css,添加一句代码用于给整个网站字体做出修改
* { font-family: Fira Code; }
然后,在html里面加上调用这个css的一句代码
<link rel="stylesheet" type="text/css" href="./css/stylesheet.css">
我删除了全部css的调用字体代码,改为单独调用一个字体的css,然后就可以正常访问啦