前言

今天想把自己新写的个人主页套上cdn,但是遇到了一个问题

 

 

这里可以看见,tff字体文件加载的确成功了,但是却因为跨域问题而不能载入

百度的方法很多需要涉及到修改nginx配置等,所以我解决一下不需要修改配置调用一个css即可解决的办法

 

方法

首先打开一个网站,这个网站可以把字体文件转换为base64码的css文件

https://transfonter.org/

这里简单解释一下需要用到的功能

  • 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,然后就可以正常访问啦

说点什么
支持Markdown语法
好耶,沙发还空着ヾ(≧▽≦*)o
Loading...