当前位置:   article > 正文

html字体库的是引入----阿里妈妈_alimamdongfangdakai

alimamdongfangdakai

icomoon字库:http://icomoon.io
阿里妈妈字体库:http://www.iconfont.cn/

阿里上面字体库的安装,因为看网友说不能改字体所以自己尝试了一下,是可以改字体的,但是官方给出了3种安装方法,但是本人比较愚钝,只搞明白其中一种方法。在此记录一下,个人感觉阿里字体安装的比较麻烦,不如icomoon安装省事,但是阿里是免费的,恩,对的,白嫖真香,icommon也确实不错,但是毕竟是外网,加载速度太慢了。
首先,进入网站。当然需要登入的,没有账号的去注册一个就行。
在这里插入图片描述
登入之后先创建自己的一个项目,![在这里插入图片描述](https://img-blog.csdnimg.cn/20210416113722734.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L20wXzQ3NTMxODI5,size_16,color_FFFFFF,t_70#pic_center这里新建
只需要随便填写一个名字就行啦。
在这里插入图片描述
创建好了之后,可以在搜索框内搜索自己想要的类型。然后加入购物车。
在这里插入图片描述
打开你的购物车,选择添加新项目,加入到之前你已经创建好的项目在这里插入图片描述
然后进入到我的项目,选择下载到本地。下载完成之后解压。
在这里插入图片描述
解压完成之后是这个样子的,
在这里插入图片描述
在里面找到demo_index.html的文件打开,里面有安装方法,此方法是对应里面的第一种方法的。
我们把解压到的文件先复制,**然后粘贴到你在vscode(我用的是vscode)创建的项目的根目录文件里面,**记住一定是根目录,还有就是解压文件夹里面的内容复制粘贴进去,否则出不来我们想要的效果。
在这里插入图片描述
关于根目录可以在这里右击选择“在文件资源管理器中显示”,或者快捷键Shift+Alt+r ,粘贴完成之后呢,我们点击这个文件,前面说过了,里面有安装方法。在这里插入图片描述
打开之后呢,他是这个样子的,
在这里插入图片描述
那么我们就按照他说的去做。在这里插入图片描述
完成之后:是这样的,在修改字体样式哪里可以修改字体图标的样式,如:字体大小,字体颜色之类的。在这里插入图片描述
出来以后的效果:在这里插入图片描述

不过后来我感觉再解压完下载的字体库文件后,再去复制粘贴里面的文件太多了。所以经过我自己的测试,我们只需要粘贴一个文件即可。不必要粘贴所有的文件。
在这里插入图片描述
那么还有一个问题就是,添加了新的图标之后,我们该怎么引入新的图标呢?
其实在一开始,我以为是非常的简单呢?我们通过Unicode编码来定位字体的。而一开始也一样新增的Unicode图标编码。如图,前面两个是我新增的,于是乎,就只把vscode里面的Unicode编码改了一下,测试不行,什么也没出来。在这里插入图片描述
最后发现原来字体库里没有新增的字体,那么我们自然得不到,新的字体了。那么方法就是:还是下载至本地,解压新的文件夹,之后把之前说的那个重要文件复制粘贴到根目录下面就行啦。其实和外网的那个差不多。

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/IT小白/article/detail/871856
推荐阅读
  • 相关标签
      

    闽ICP备14008679号