字体图标设置

最新推荐文章于 2022-05-11 22:38:35 发布

艾莉宝贝

最新推荐文章于 2022-05-11 22:38:35 发布

阅读量958

点赞数

分类专栏： html 文章标签：字体图标 h5

本文链接：https://blog.csdn.net/weixin_42793426/article/details/81354267

版权

html 专栏收录该内容

7 篇文章 1 订阅

订阅专栏

1.自定义字体图标

@font-face{

font-family:'abcdef';

src: url('./iconfont.ttf');

}

p{ font-family:'abcdef';font-size:30px }

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>字体图标</title>
	<style>
		/* 第一步: 自定义 字体图标 */
		@font-face{
			font-family: 'abcdef';
			src: url('./iconfont/iconfont.ttf');
		}

		/* 第二步: 使用字体图标 */
		p{font-family:'abcdef'; font-size:30px;}
		p:hover{color:red;}


		/* 字体图标地址: http://www.iconfont.cn/ */


	</style>
</head>
<body>
	
	<p>&#xe64c;</p>


</body>
</html>

导入图标样式-> 写入样式的类名->写符号

<link rel="stylesheet" href="./iconfont/iconfont.css">
	
<p class='iconfont'>&#xe65c;</p>

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

艾莉宝贝

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
字体图标设置

1.自定义字体图标 @font-face{ font-family:'abcdef'; src: url('./iconfont.ttf'); } p{ font-family:'abcdef';font-size:30px } &lt;p&gt; &amp;#xe64c; &lt;/p&g...
复制链接

扫一扫