首页 > 其他分享 >在博客中添加外部icon的一种方法

在博客中添加外部icon的一种方法

时间:2022-10-18 10:47:29浏览次数:74  
标签:调用 代码 博客 添加 链接 icon

由于非互联网专业,又是第一次接触博客和网页编辑所以网上一些教程实现失败,所以做一个傻瓜式的教程,帮助一下我这样的萌新.

寻图

使用阿里矢量图库

http://www.iconfont.cn/
在图库中找到需要的icon,添加入库

把icon添加进项目

点击右上角购物车样式图标打开以下界面,并将icon添加进项目(如果没有项目就随便新建一个)

在我的项目中获取css代码

进入我的项目(可在我的资源中找到),选择Font Class(若没有代码链接点查看在线链接)

复制代码

点击得到的链接可得下图,全选代码复制进入博客后台的页面定制css代码栏

调用icon

在使用位置直接调用即可,名称如下图划线部分(icon-jiahao)

调用(以silence美化为例)

完成!

本文完全是操作性质,可能有很多步骤绕了路,因为本身没学过Html,但是最终也是能达成目的,如果可以帮到一些和我一样的新手就好了。
空下来也要好好学一下网页制作了看来

标签:调用,代码,博客,添加,链接,icon
From: https://www.cnblogs.com/Rok-100/p/16801246.html

相关文章

  • DML_添加数据与DML_删除数据
    DML_添加数据DML:增删改表中的数据1.添加数据语法:insertinto表名(列名1,列名2,....列名n)values(值1,值2,....值n);  ......
  • React循环DOM时为什么需要添加key
    一、React渲染流程和更新流程react渲染流程:jsx->虚拟dom->真实domreact更新流程:props/state改变->render函数重新执行->生成新的虚拟dom树->新旧虚拟dom树进......
  • 博客声明
    偶然发现cnblogs十分好用,于是就搞了一个由于官方主题过于简朴,不符合我华丽的气质 ,我用来一个第三方主题,目前感觉体验还行。可能是因为我太蒟了,有些问题没有处理好,比如个......
  • 用声网 Android UIKit 为实时视频通话应用添加自定义背景丨声网 SDK 教程
     使用声网SDK和UIKit创建视频推流应用非常简单,而且声网还有许多功能,可以提高视频通话的质量和便利性。例如,我们可以在视频通话过程中使用虚拟背景,为视频通话增添趣......
  • 【个人实验报告】博客网站
    目录​​项目名称​​​​个人实验目标​​​​完成情况​​​​项目主要内容​​​​1.任务完成情况:​​​​2.项目目标实现情况:​​​​3.项目经验总结:​​​​4.存在的不......
  • Python set集合基本操作(添加、删除、交集、并集、差集)
    Python set集合最常用的操作是向集合中添加、删除元素,以及集合之间做交集、并集、差集等运算,本节将一一讲解这些操作的具体实现。向set集合中添加元素set集合中添......
  • Python dict字典基本操作(包括添加、修改、删除键值对)
    由于字典属于可变序列,所以我们可以任意操作字典中的键值对(key-value)。Python 中,常见的字典操作有以下几种:向现有字典中添加新的键值对。修改现有字典中的键值对。从现......
  • WordPress给附件添加属性
    •介绍WordPress的附件(多媒体)默认已经有一些对应的属性了,我们还可以再添加一些信息。•玉照[captionid="attachment_3523"align="aligncenter"width="399"]​​​​w......
  • WordPress在插件管理页面添加超链接
    •介绍如果你创建了一个插件,WordPress的插件管理页面中就可以看到,而且会有启用、停用、编辑等默认的超级链接按钮。那么,怎么才能添加一个自定义的呢?•玉照[captionid="a......
  • win11扯蛋的防火墙:远程桌面默认只添加了UDP端口规则
    win11扯蛋的防火墙:远程桌面默认只添加了UDP端口规则。开启防火墙后,导致win10以下的mstsc客户端无法访问。解决办法就是在防火墙高级设置,添加远程桌面端口(默认3389)的TCP......