CSS3中的unicode字符编码,来添加图标

使用方法
1,第一步
使用utf-8编码。
2,第二步
下面有两列编码,第一列是html编码,使用时,需要在其前面加&#;
第二列是css编码。使用时,需要在其前面加 \ 转义;
第二列也可用于js,使用时,需要在其前面加 \u 来转义。

注意事项

1,有些字符在不同浏览器下表现样式有所不同,需要注意.
2,例如以下这些是浏览器支持的unicode字符编码,如果需要使用的图标浏览器不是浏览器默认支持的,就需要引入字体图标库。

常用的字体图标库如下
2.1 阿里图标
2.2 icomoon
常用字符如下
在这里插入图片描述
使用demo

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>Unicode字符编码</title>
		<style>
			.icon{
				font-size: 14px;
				color: red;
				padding-right: 5px;
			}
			.icon-left:before{
				content:'\21E0';
				
			}
		</style>
	</head>
	<body>
		<p>&#8672</p>
		<p><i class="icon icon-left"></i>箭头</p>
	</body>
</html>

参考链接 https://blog.csdn.net/sinat_17775997/article/details/52384680

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章