使用方法:
1、head引入css文件
<!--图标库-->
<link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css'>
<!--主要样式-->
<link rel="stylesheet" href="css/style.css">
2、body引入部分
<ul>
<li>
<a class="facebook" href="#">
<span></span>
<span></span>
<span></span>
<span></span>
<i class="fa fa-facebook" aria-hidden="true"></i>
</a>
</li>
<li>
<a class="twitter" href="#">
<span></span>
<span></span>
<span></span>
<span></span>
<i class="fa fa-twitter" aria-hidden="true"></i>
</a>
</li>
<li>
<a class="instagram" href="#">
<span></span>
<span></span>
<span></span>
<span></span>
<i class="fa fa-instagram" aria-hidden="true"></i>
</a>
</li>
<li>
<a class="google" href="#">
<span></span>
<span></span>
<span></span>
<span></span>
<i class="fa fa-google-plus" aria-hidden="true"></i>
</a>
</li>
</ul>