美工统筹SEO,为企业电子商务营销助力!
若何在网页建造中给网页字体文件增添矢量图标
一佰互联网站建造(www.taishanly.com) 宣布日期 2020-04-22 10:09:31 阅读数: 87
点阵图在图片缩小的时辰会呈现恍惚景象,矢量图则不会。是以愈来愈多人起头操纵矢量图来作为网页图标。良多人会碰到如许的一种情况,便是自身去网站下载了一个带了一些矢量图图标的字体文件,在前期开辟中,图标必要不时的更新和增添,若是持续下载ttf字体文件,则很占空间,会呈现为了增添一个图标,下载好几个文件的情况。下面呢,我会为大师讲授若何在原本的字体文件上增添图标。
起首我先保举两个有矢量图标库的网址
阿里巴巴矢量图标库http://iconfont.cn/
谷歌阅读器里的矢量图库http://icomoon.io/
第一局部,先容若何找到自身必要的图标
起首,进中计页:阿里巴巴矢量图标库http://iconfont.cn/
在搜刮框内输出必要的图标称号,比方说“主页”、“攻略”,确认。
找到自身必要的图标,鼠标移上去,选中左下角的“购物框”
右上角的“贮存架”,会呈现一个已保藏的图标
再搜刮“攻略”,找到图标,放到“储物架”。
点击“登录”,挑选一种登录体例
此刻将鼠标移到“储物架”储,点击“存储为名目”,点击“存储”
第二局部,是先容若何将后面的图标增添到已有的字体文件
此刻找到咱们已有的字体文件“new-iconfont.ttf”,用“fontlab”软件翻开文件
翻开后就能够看到ttf字体文件里的图标,每一个图标都有自身的Unicode编码,由于每一个图标的Unicode相称于自身的“身份证”,内部文件必要操纵外面的图标时,必要操纵这张“身份证”。
双击此中一个图标,便可清楚的看到图标下面的“Unicode”,这张图标则是“E808”
在领会ttf字体文件自身已有的Unicode编码后,若是在阿里巴巴图库的已选图标的Unicode编码与此中有反复,则点击左下角的点窜按钮,停止点窜
确认点窜后,点击“下载到本地”,解压,会呈现几个字体文件,和css文件
此刻能够用Fontlab软件,翻开外面的ttf文件
选中自身必要增添的两个图标,点击鼠标右键中的“copy”。而后前往之前已有的字体的文件
选中最初的图标用右键选中“Append Glyphs”,将必要的图标增添出来
到这里就增添完了,操纵疾速键Gtrl+Alt+G,保管为ttf文件
以上便是小编为大师带来的若何在网页建造中给网页字体文件增添矢量图标的全数内容,但愿对大师有所赞助,更多内容请持续存眷网页设想