CSS，font awesome和iconfont引入图标，并改变图标大小，颜色的方法

最新推荐文章于 2024-07-19 17:50:11 发布

liangyuexixi

最新推荐文章于 2024-07-19 17:50:11 发布

阅读量1.3w

点赞数 1

文章标签： css

本文链接：https://blog.csdn.net/liangyuexixi/article/details/107787106

版权

1.font awesome

（1）在官网上下载图标库文件

（2）代码

<!DOCTYPE html>

<head>

<title>Document</title>

<style>

span.plane{ //span标签.对应图标所设置的属性值对相应图标进行操作

color:#ccc; //图标颜色

font-size:100px; //图标大小

}

span:hover{

color:blue;

}

font-size:10px;

}

</style>

</head>

<body>

<span class="fa fa-plane plane"></span> //引用图标 class="fa fa-图标名称设置class属性值"

</body>

</html>

2.iconfont

(1)进入官网找到所需图标加入购物车

（2）添加至项目，点击确定

（4）点击下载至本地

（5）复制图标代码

(6)代码

<!DOCTYPE html>

<head>

<title>Document</title>

</head>

<body>

<span class="iconfont icon-wode"></span> //class="iconfont 下载的图标的代码“

</body>

</html>

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

liangyuexixi

关注关注

1
点赞
踩
4

收藏

觉得还不错? 一键收藏
0
评论
CSS，font awesome和iconfont引入图标，并改变图标大小，颜色的方法

1.font awesome（1）在官网上下载图标库文件（2）代码<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>Document</title><linkrel="stylesheet"href="../font-awesome-4.7.0/css/font-awesome.mi...
复制链接

扫一扫