在伪元素中如何使用字体图标

一、下载字体图标

二、将下载的字体图标放到项目中

三、在main.js中引入

四、在css中的使用

&::after {content: '\e601';font-family: 'iconfont' !important;font-size: 16px;font-style: normal;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;
}

content中写的内容就是：+&#x后面的e601

必须加上这段代码才生效

在伪元素中如何使用字体图标相关推荐

伪元素选择器使用场景-字体图标(CSS3)
伪元素选择器使用场景-字体图标(CSS3) <!DOCTYPE html> <html lang="en"><head><meta cha ...
[react] 在React中怎么使用字体图标？
[react] 在React中怎么使用字体图标? 1.npm install --save react-fontawesome 2.npm install font-awesome 3.import ...
html+字体图标找不到字体,bootstrap中不显示字体图标问题怎么解决？
bootstrap中不显示字体图标的原因是什么?怎么解决?下面本篇文章给大家介绍一下.有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助. 你在使用bootstrap字体图标的时候,是否遇 ...
安卓开发使用ttf文字_Android中正确使用字体图标(iconfont)的方法
字体图标字体图标是指将图标做成字体文件(.ttf),从而代替传统的png等图标资源. 使用字体图标的优点和缺点分别为: 优点: 1. 可以高度自定义图标的样式(包括大小和颜色),对于个人开发者尤其适 ...
在 Quasar cli 搭建的 vue 项目中引用阿里字体图标 iconfont symbol方式
在 Quasar cli 搭建的 vue 项目中引用阿里字体图标 iconfont 1. symbol 方式 2. font class 方式(未实践) 1. symbol 方式首先说明一下,这 ...
uni-app中使用扩展字体图标遇到的坑
uni支持使用字体图标,跟web使用方法一样.需iconfont.css文件中的引用方式在项目中存放位置在app.vue文件中全局引用字体图标 //在app.vue中引用方式 @import '. ...
在vue中如何使用字体图标(阿里巴巴)
在vue中如何使用字体图标(阿里巴巴) 1.选择需要的图标加入购物车. 2.打开购物车,添加至项目. 3.点击生成在线代码 4.点击下载至本地,放入需要文件夹下,可以放入assets下. 5.在sty ...
伪元素中content的用法详解
content:""----->扩展伪元素中的content玩起来,还是有很多花里胡哨的东西,我们来看看它的一些用法吧,可能我们用的比较少,但是有时候用到的时候,简直舒服呀 ...
Iconfont的引用与在伪元素中的图标引用
在线引用复制font class的在线链接 <link rel="stylesheet" href="http://at.alicdn.com/t/font_21 ...

在伪元素中如何使用字体图标

一、下载字体图标

二、将下载的字体图标放到项目中

三、在main.js中引入

四、在css中的使用

在伪元素中如何使用字体图标相关推荐

最新文章

热门文章