前端字体图标保姆级攻略
字体图标
展示的是图标，本质是字体。
处理简单，颜色单一的小图标。
优点：体积小，灵活的修改样式，兼容所有浏览器，使用方便
使用：
网址：https://www.iconfont.cn/ 阿里巴巴字体库（常用）
下载字体库：登陆网址—选择图标库–选择图标–加入购物车–添加至项目–下载到本地
使用：解压–打开文件，复制√文件到fonts文件夹
第一种方式
DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Documenttitle><link rel="stylesheet" href="./fonts/iconfont.css"><style>.icon-icon-test9 {font-family: 'icofont';font-size: 60px;color: green;font-style: italic;}style>
head><body><span class="iconfont icon-icon-test9">span>
body>html>
伪元素字体图标使用方式
<style>.hurt {width: 200px;height: 45px;border: 1px solid green;text-align: center;line-height: 45px;}.hurt::before {font-family: 'iconfont';content: '\e634';}.hurt::after {font-family: 'iconfont';content: '\e63a';}style>
head><body><div class="hurt">小栗子div>
本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！