0-9 字体图标

xiaohe_qianduan

于 2020-04-10 09:34:33 发布

阅读量268

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/xiaohe_qianduan/article/details/105426255

本文详细介绍了如何在HTML文档中加载和使用自定义图标字体，包括设置字体样式、指定字体文件路径及在页面元素中应用图标的具体方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >


<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style>
		@font-face {
			/*1. 这个字体名称要注意 icomoon*/
		  font-family: 'icomoon';
		  /*2. 一定要注意路径的问题*/
		  src:  url('fonts/icomoon.eot?7kkyc2');
		  src:  url('fonts/icomoon.eot?7kkyc2#iefix') format('embedded-opentype'),
		    url('fonts/icomoon.ttf?7kkyc2') format('truetype'),
		    url('fonts/icomoon.woff?7kkyc2') format('woff'),
		    url('fonts/icomoon.svg?7kkyc2#icomoon') format('svg');
		  font-weight: normal;
		  font-style: normal;
	}
	span,
	div,
	strong {
		font-family: 'icomoon';
		font-size: 50px;
		color: red;
	}
	</style>
</head>
<body>
	<span>  </span>
	<div>  </div>
	<strong>  </strong>
</body>
</html>