HTML5图标库"
date: 2021-03-12
tags: ["html5","css","javascript"]
categories: ["html5","css","javascript"]

Font Awesome 官网

Font Awesome 中文网

此图标库付费版比免费版要多出很多,如有需要可购入付费版

你只需在网站引入css样式

<html>
<head>
<link href="https://cdn.jsdelivr.net/gh/skyxingcheng/ic-cdn@master/static/css/font-awesome.min.css" rel="stylesheet">
<style>
	body {
	background-color: #f58f98;
	min-height: 100%;
	min-weight: 100%;
	height: auto;
	weight: auto;
	}
	.icons {
	text-align: center;
	}
	.icons a {
	width: 128px;
	height: 128px;
	color: #fff;
	background: rgba(7, 10, 12, 0.5);
	display: inline-table;
	text-align: center;
	font-size: 50px;
	margin-left: 5px;
	margin-bottom: 30px;
	}
	.icons a i{
	display: table-cell;
	vertical-align: middle;
	}
</style>
</head>
<body>
	<div class="icons">
		<a href="#" target="_blank"><i class="fa fa-facebook"></i></a>
		<a href="#" target="_blank"><i class="fa fa-twitter"></i></a>
		<a href="#" target="_blank"><i class="fa fa-linkedin"></i></a>
		<a href="#" target="_blank"><i class="fa fa-pinterest"></i></a>
	</div>
</body>
</html>

你可以在这里搜索到想要的图标 https://fontawesome.com/icons

图片仅供参考

End

Q.E.D.