iconfont使用 或者项目后再次追加_会说话的字符的博客-程序员宅基地

技术标签: css  偌依项目  vue.js  javascript  

01.使用

icongont官网:https://www.iconfont.cn/home/index?spm=a313x.7781069.1998910419.2

image.png

01.添加到购物车并下载代码 得到一个压缩包并解压

02.(.css .html .css .js .json .ttf)六个文件放入项目
03.更改iconfont.css

[class^='icon'] {
     //表示icon开头的样式
  font-family: 'iconfont' !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

04.mian.js引入iconfont.css就可以使用了

mian.js
import '@/assets/font/iconfont.css'

vue组件中
<div class="icon-a-xingbienanshitouxiang"></div>
<i class="icon1111111">&#xe775;</i>

02.追加图标

02.1 还是正常下载压缩包并解压

02.2 (eot svg ttf woff)这四种文件更改一下名字(防止冲突)后放入原有的文件夹里

image.png
02.3 进入原来的iconfont.css添加代码

image.png
02.4 为了方便以后查看,还需要将新的html部分代码加到原来的html
就2部分,都是li
image.png

往下滑还有

image.png

现在就能用了!!!

image.png

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/weixin_55333190/article/details/122076015

智能推荐

安徽省2019c语言二级答案,2019年全国计算机二级C语言练习及答案二_季文冬的博客-程序员宅基地

【摘要】备考全国计算机二级C语言考试的小伙伴们,知识点掌握的都怎么样了呢?环球网校小编整理了2019年全国计算机二级C语言练习及答案解析供大家练习,小伙伴们快来做一做,测试一下自己吧!了解更多全国计算机二级C语言备考资料敬请关注环球网校计算机二级频道。1.[单选题]若有以下说明语句:struct date{ int year;int month;int day;}brithday;则下面的叙述不正...

Selenium自动化(鼠标键盘操作)------详细_网易测试开发猿的博客-程序员宅基地

Selenium自动化(鼠标键盘操作)一、模拟按键输入driver.find_element_by_id('kw').send_keys("史蒂芬库里")清除对象的内容,一般是对有默认值的时候:time.sleep(3)driver.find_element_by_id('kw').clear()单击对象(此处实在百度官网测试):driver.find_element(By.ID, "su").click()提交表单,要求对象必须是表单:driver.find_element_by_

文档扫描OCR识别-1(python)_justwaityou1314的博客-程序员宅基地

凯哥英语视频文档扫描OCR识别凯哥英语视频1.现有资源梳理2.实现方案规划对模板操作,将十个模板和对应的数字一一对应起来对测试图片操作,取得我们需要的,每个数字的像素 .3.代码实现结语1.现有资源梳理目前有一张卡号模板图片N张测试银行卡图片,其一如下操作环境 win10-64位代码语言 Python 3.62.实现方案规划对模板操作,将十个模板和对应的数字一一对应起来图片中通过查找轮廓,然后绘制轮廓外界矩形的方式,将每一和数字分割出来,并和对应的数字相对应。以字典的形式保存每一个模

Tomcat9的安装、配置与使用(文末解决Tomcat9的乱码问题)_是七叔呀的博客-程序员宅基地_tomcat9 乱码

一、Tomcat服务器与servlet版本的关系官网网址:https://tomcat.apache.org/whichversion.html二、Tomcat的下载与安装说明1、访问Tomcat的官网https://tomcat.apache.org2、下载Tomcat免安装版点击Download下的Tomcat9根据自己的电脑位数来下载相应的免安装版安装包下载zip压缩包完成下载后的包安装目录介绍bin 可以执...

Vue 路由传参_ZHANGC·的博客-程序员宅基地

路由传参三种方式需求:获取传递参数&lt;router-link to="/login/11314555"&gt;路由传参&lt;/router-link&gt;&lt;button @click="loginById('11314555')"&gt;路由传参&lt;/button&gt;方式一路由配置: { path: '/login/:id', name: 'login', component: login }需要在path中添加 /:id 来对应

一些好用的工具收藏(持续更新)_二楼后座Scarlett的博客-程序员宅基地

收藏一些工具(持续更新) [多为深度学习]jupyter notebook 基于深度学习的代码补全插件https://github.com/wenmin-wu/jupyter-tabnine(:不限框架,模型是拿CPT-2 pretrain的模型再用代码fine tuning)AI性能评估包 ai-benchmarkhttps://pypi.org/project/ai-benchma...

随便推点

platform设备驱动简介_laohuang1122的博客-程序员宅基地_platform 设备驱动

简介:目的:说白了就是为了将设备与驱动分离,通过platform总线进行连接废话不多说:相关结构介绍:1.platform设备结构体structplatform_device{const charname;/*设备名*/u32 id;/*设备id*/struct device dev;/*设备*/u32 num_resource;

持久化和对象关系映射ORM技术_小落勇士的博客-程序员宅基地

 何谓“持久化”持久(Persistence),即把数据(如内存中的对象)保存到可永久保存的存储设备中(如磁盘)。持久化的主要应用是将内存中的数据存储在关系型的数据库中,当然也可以存储在磁盘文件中、XML数据文件中等等。何谓“持久层”持久层(Persistence Layer),即专注于实现数据持久化应用领域的某个特定系统的一个逻辑层面,将数据使用者和数据实体相关联。何谓“对象数据映射(O

辨音项目阶段总结(2021-10-5)_龚建波的博客-程序员宅基地

该项目是一个处理音频的 PC 客户端,采用 QtQuick 框架开发,主要功能为对音频进行背景降噪、人声分离,以及音频批量比对、聚类等(就是调用下算法库和写写界面交互),在此基础上又增加了音频库(文件管理)、录音、微信语音转写等功能。从2020-11月参与项目到现在,历经多次迭代,也发现了不少软件设计上的问题,故做一个阶段总结。回顾先看看参与项目时已有代码的面貌:划分为主进程(UI交互)、封装的公共库、算法进程三个编译模块,UI 和 算法进程通过 rpc 交互。运行起来虽然像个 demo,但是基本的

MIMO-OTFS in High-Doppler Fading Channels:Signal Detection and Channel Estimation(1)_三省少年的博客-程序员宅基地

content1.abstract2.introduction3.OTFS Modulation3.1 Time-frequency modulation1.abstractwe focus on MIMO-OTFS which brings in the high spectral and energy efficiency benefits of MIMO and the robustne...

通过 JS 脚本去除csdn广告_weixin_34068198的博客-程序员宅基地

1. chorme 浏览器1.1 通过书签方式添加新建书签:在网址一栏中输入:javascript: $(function () { $('aside .csdn-tracking-statistics').hide();$('#asideFooter').hide();$('.pulllog-box').hide();$('#dmp_ad_58').remove();$('.indexS...

ip端口和域名的理解_一只攻城狮√的博客-程序员宅基地

1.当我们把项目部署到自己的服务器上以后,一般可以通过两种形式访问项目,一种是ip+端口号,还有一种是域名访问.ip的理解通俗点说就是IP地址是用于标识出网络上的每一台主机的编号。有这个编号,网络上的其他主机才能在互联网浩若繁星的主机中定位到唯一的一台主机。域名的理解域名,(英语:domain name),是由一串用“点”分隔的字符组成的Internet上某一台计算机或计算机组的名称,用于...

推荐文章

热门文章

相关标签