FontAwesome⼀套绝佳的图标字体库和CSS框架
在bootstrap框架的使⽤中，字体图标必不可少，Font Awesome ⼀套绝佳的图标字体库和CSS框架，值得学习。
###使⽤⽰例 1：引⼊Font Awesome图标⽂件或者使⽤使⽤LESS或SASS的⽅法来⾃定义 Font Awesome 4.7.0 。
<link href="cdn.bootcss/font-awesome/4.7.0/css/font-awesome.css" rel="stylesheet">
您可以将Font Awesome图标使⽤在⼏乎任何地⽅，只需要使⽤CSS前缀 fa ，再加上图标名称。 Font Awesome是为使⽤内联元素⽽设计的。我们通常更喜欢使⽤ <i> ，因为它更简洁。 但实际上使⽤ <span> 才能更加语义化。
###代码⽰例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Bootstrap 实例 font-awesome图标</title>
<link href="cdn.bootcss/font-awesome/4.7.0/css/font-awesome.css" rel="stylesheet">
<link rel="stylesheet" href="cdn.bootcss/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="cdn.bootcss/jquery/2.1.1/jquery.min.js"></script>
<script src="cdn.bootcss/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<div class="list-group">
<a class="list-group-item" href="#"><i class="fa fa-home fa-fw"></i> ；主页</a>
<a class="list-group-item" href="#"><i class="fa fa-book fa-fw"></i>  图书馆</a>
<a class="list-group-item" href="#"><i class="fa fa-pencil fa-fw"></i>  提交申请</a>
<a class="list-group-item" href="#"><i class="fa fa-cog fa-fw"></i>  设置</a>
</div>jquery框架使用
</body>
</html>
###效果如下
90后前端妹⼦，爱编程，爱运营，爱折腾。 坚持总结⼯作中遇到的技术问题，坚持记录⼯作中所所思所见，欢迎⼤家⼀起探讨交流。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。