fontawesomehelper

<!DOCTYPE html>  <html lang="zh-CN" class="fas-events-icons-ready fas-events-typefaces-proxima-nova-ready fas-events-typefaces-proxima-nova-600-normal-ready fas-events-typefaces-proxima-nova-normal-normal-ready fas-events-typefaces-proxima-nova-300-normal-ready fas-events-typefaces-museo-slab-ready fas-events-typefaces-museo-slab-500-normal-ready fas-events-typefaces-proxima-nova-sc-ready fas-events-typefaces-proxima-nova-sc-300-normal-ready"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="description" content="Font Awesome，一套绝佳的图标字体库和CSS框架"> <meta name="author" content="极风游科技"> <meta name="keywords" content="Font Awesome,Bootstrap,CSS,图标,字体,icon font,极风游,极风游科技,dashgame"> <link rel="shortcut icon" href="http://fontawesome.dashgame.com/assets/ico/favicon.ico"> <title>Font Awesome，一套绝佳的图标字体库和CSS框架</title> <link rel="stylesheet" href="./Font Awesome，一套绝佳的图标字体库和CSS框架_files/site.css"> <link rel="stylesheet" href="./Font Awesome，一套绝佳的图标字体库和CSS框架_files/pygments.css"> <link rel="stylesheet" href="./Font Awesome，一套绝佳的图标字体库和CSS框架_files/font-awesome.css"> <link href="./Font Awesome，一套绝佳的图标字体库和CSS框架_files/toastr.min.css" rel="stylesheet"> <link rel="stylesheet" href="./Font Awesome，一套绝佳的图标字体库和CSS框架_files/fix.css">  <script src="./Font Awesome，一套绝佳的图标字体库和CSS框架_files/ffe176a3.js"></script><style type="text/css" adt="123"></style><link rel="stylesheet" href="./Font Awesome，一套绝佳的图标字体库和CSS框架_files/woff2.css" media="all"> <script src="./Font Awesome，一套绝佳的图标字体库和CSS框架_files/share.js"></script><script>//console.log('a') </script><script>doAdblock(); function doAdblock(){ (function() { function A() {} A.prototype = { rules: { 'pps_pps': { 'find': /^http:\/\/www\.iqiyi\.com\/player\/cupid\/common\/pps_flvplay_s\.swf/, 'replace': 'http://swf.adtchrome.com/pps_20140420.swf' }, '17173_in':{ 'find':/http:\/\/f\.v\.17173cdn\.com\/(\d+\/)?flash\/PreloaderFile(Customer)?\.swf/, 'replace':"http://swf.adtchrome.com/17173_in_20150522.swf" }, '17173_out':{ 'find':/http:\/\/f\.v\.17173cdn\.com\/(\d+\/)?flash\/PreloaderFileFirstpage\.swf/, 'replace':"http://swf.adtchrome.com/17173_out_20150522.swf" }, '17173_live':{ 'find':/http:\/\/f\.v\.17173cdn\.com\/(\d+\/)?flash\/Player_stream(_firstpage)?\.swf/, 'replace':"http://swf.adtchrome.com/17173_stream_20150522.swf" }, '17173_live_out':{ 'find':/http:\/\/f\.v\.17173cdn\.com\/(\d+\/)?flash\/Player_stream_(custom)?Out\.swf/, 'replace':"http://swf.adtchrome.com/17173.out.Live.swf" } }, _done: null, get done() { if(!this._done) { this._done = new Array(); } return this._done; }, addAnimations: function() { var style = document.createElement('style'); style.type = 'text/css'; style.innerHTML = 'object,embed{\ -webkit-animation-duration:.001s;-webkit-animation-name:playerInserted;\ -ms-animation-duration:.001s;-ms-animation-name:playerInserted;\ -o-animation-duration:.001s;-o-animation-name:playerInserted;\ animation-duration:.001s;animation-name:playerInserted;}\ @-webkit-keyframes playerInserted{from{opacity:0.99;}to{opacity:1;}}\ @-ms-keyframes playerInserted{from{opacity:0.99;}to{opacity:1;}}\ @-o-keyframes playerInserted{from{opacity:0.99;}to{opacity:1;}}\ @keyframes playerInserted{from{opacity:0.99;}to{opacity:1;}}'; document.getElementsByTagName('head')[0].appendChild(style); }, animationsHandler: function(e) { if(e.animationName === 'playerInserted') { this.replace(e.target); } }, replace: function(elem) { if (/http:\/\/v.youku.com\/v_show\/.*/.test(window.location.href)){ var tag = document.getElementById("playerBox").getAttribute("player") if (tag == "adt"){ console.log("adt adv") return; } } if(this.done.indexOf(elem) != -1) return; this.done.push(elem); var player = elem.data || elem.src; if(!player) return; var i, find, replace = false; for(i in this.rules) { find = this.rules[i]['find']; if(find.test(player)) { replace = this.rules[i]['replace']; if('function' === typeof this.rules[i]['preHandle']) { this.rules[i]['preHandle'].bind(this, elem, find, replace, player)(); }else{ this.reallyReplace.bind(this, elem, find, replace)(); } break; } } }, reallyReplace: function(elem, find, replace) { elem.data && (elem.data = elem.data.replace(find, replace)) || elem.src && ((elem.src = elem.src.replace(find, replace)) && (elem.style.display = 'block')); var b = elem.querySelector("param[name='movie']"); this.reloadPlugin(elem); }, reloadPlugin: function(elem) { var nextSibling = elem.nextSibling; var parentNode = elem.parentNode; parentNode.removeChild(elem); var newElem = elem.cloneNode(true); this.done.push(newElem); if(nextSibling) { parentNode.insertBefore(newElem, nextSibling); } else { parentNode.appendChild(newElem); } }, init: function() { var handler = this.animationsHandler.bind(this); document.body.addEventListener('webkitAnimationStart', handler, false); document.body.addEventListener('msAnimationStart', handler, false); document.body.addEventListener('oAnimationStart', handler, false); document.body.addEventListener('animationstart', handler, false); this.addAnimations(); } }; new A().init(); })(); } // 20140730 (function cnbeta() { if (document.URL.indexOf('cnbeta.com') >= 0) { var elms = document.body.querySelectorAll("p>embed"); Array.prototype.forEach.call(elms, function(elm) { elm.style.marginLeft = "0px"; }); } })(); //baidu if(document.URL.indexOf('www.baidu.com') >= 0){ if(document && document.getElementsByTagName && document.getElementById && document.body){ var aa = function(){ var all = document.body.querySelectorAll("#content_left div,#content_left table"); for(var i = 0; i < all.length; i++){ if(/display:\s?(table|block)\s!important/.test(all[i].getAttribute("style"))){all[i].style.display= "none";all[i].style.visibility='hidden';} } all = document.body.querySelectorAll('.result.c-container[id="1"]'); //if(all.length == 1) return; for(var i = 0; i < all.length; i++){ if(all[i].innerHTML && all[i].innerHTML.indexOf('广告')>-1){ all[i].style.display= "none";all[i].style.visibility='hidden'; } } } aa(); document.getElementById('wrapper_wrapper').addEventListener('DOMSubtreeModified',aa) }; } // 20140922 (function kill_360() { if (document.URL.indexOf('so.com') >= 0) { document.getElementById("e_idea_pp").style.display = none; } })(); if (document.URL.indexOf("tv.sohu.com") >= 0){ if (document.cookie.indexOf("fee_status=true")==-1){document.cookie='fee_status=true'}; } if (document.URL.indexOf("56.com") >= 0){ if (document.cookie.indexOf("fee_status=true")==-1){document.cookie='fee_status=true'}; } if (document.URL.indexOf("iqiyi.com") >= 0){ if (document.cookie.indexOf("player_forcedType=h5_VOD")==-1){ document.cookie='player_forcedType=h5_VOD' if(localStorage.reloadTime && Date.now() - parseInt(localStorage.reloadTime)<60000){ console.log('no reload') }else{ location.reload() localStorage.reloadTime = Date.now(); } } } </script><style type="text/css">object,embed{ -webkit-animation-duration:.001s;-webkit-animation-name:playerInserted; -ms-animation-duration:.001s;-ms-animation-name:playerInserted; -o-animation-duration:.001s;-o-animation-name:playerInserted; animation-duration:.001s;animation-name:playerInserted;} @-webkit-keyframes playerInserted{from{opacity:0.99;}to{opacity:1;}} @-ms-keyframes playerInserted{from{opacity:0.99;}to{opacity:1;}} @-o-keyframes playerInserted{from{opacity:0.99;}to{opacity:1;}} @keyframes playerInserted{from{opacity:0.99;}to{opacity:1;}}</style><link rel="stylesheet" href="./Font Awesome，一套绝佳的图标字体库和CSS框架_files/share_style2_16.css"></head> <body data-twttr-rendered="true"> <div id="wrap"> <div class="navbar navbar-inverse navbar-fixed-top hidden-print"> <div class="container"> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> <span class="sr-only">Toggle navigation</span> <i class="fa fa-bars fa-lg"></i> </button> <a class="navbar-brand" href="http://fontawesome.dashgame.com/#top"><i class="fa fa-flag"></i> Font Awesome</a> </div> <div class="navbar-collapse collapse"> <ul class="nav navbar-nav" id="main-nav"> <li class="hidden-sm active"><a href="http://fontawesome.dashgame.com/#wrap">首页</a></li> <li class="hidden-sm"> <a href="http://fontawesome.dashgame.com/#why">选我！</a> </li> <li class="dropdown-split-left"><a href="http://fontawesome.dashgame.com/#new">图标</a></li> <li class="dropdown dropdown-split-right hidden-xs"> <a href="javascript:;" class="dropdown-toggle" data-toggle="dropdown"> <i class="fa fa-caret-down"></i> </a> <ul class="dropdown-menu pull-right"> <li class="dropdown-header"><i class="fa fa-flag fa-fw"></i>  图标</li> <li class="divider"></li> <li class=""><a href="http://fontawesome.dashgame.com/#new"><i class="fa fa-handshake-o fa-fw"></i>  4.7.0版新增</a></li> <li class=""><a href="http://fontawesome.dashgame.com/#web-application"><i class="fa fa-camera-retro fa-fw"></i>  网页</a></li> <li><a href="http://fontawesome.dashgame.com/#hand"><i class="fa fa-hand-o-right fa-fw"></i>  手势</a></li> <li class=""><a href="http://fontawesome.dashgame.com/#accessibility"><i class="fa fa-universal-access fa-fw"></i>  辅助功能</a></li> <li><a href="http://fontawesome.dashgame.com/#transportation"><i class="fa fa-ship fa-fw"></i>  运输</a></li> <li><a href="http://fontawesome.dashgame.com/#gender"><i class="fa fa-venus-mars fa-fw"></i>  性别</a></li> <li><a href="http://fontawesome.dashgame.com/#file-type"><i class="fa fa-file-image-o fa-fw"></i>  文件类型</a></li> <li><a href="http://fontawesome.dashgame.com/#spinner"><i class="fa fa-spinner fa-fw"></i>  可旋转</a></li> <li><a href="http://fontawesome.dashgame.com/#form-control"><i class="fa fa-check-square fa-fw"></i>  表单</a></li> <li><a href="http://fontawesome.dashgame.com/#payment"><i class="fa fa-paypal fa-fw"></i>  支付</a></li> <li><a href="http://fontawesome.dashgame.com/#chart"><i class="fa fa-line-chart fa-fw"></i>  图表</a></li> <li><a href="http://fontawesome.dashgame.com/#currency"><i class="fa fa-won fa-fw"></i>  货币</a></li> <li><a href="http://fontawesome.dashgame.com/#text-editor"><i class="fa fa-file-text-o fa-fw"></i>  文本编辑</a></li> <li><a href="http://fontawesome.dashgame.com/#directional"><i class="fa fa-hand-o-right fa-fw"></i>  指示方向</a></li> <li><a href="http://fontawesome.dashgame.com/#video-player"><i class="fa fa-play-circle fa-fw"></i>  视频播放</a></li> <li><a href="http://fontawesome.dashgame.com/#brand"><i class="fa fa-github fa-fw"></i>  标志</a></li> <li><a href="http://fontawesome.dashgame.com/#medical"><i class="fa fa-medkit fa-fw"></i>  医疗</a></li> </ul> </li> <li><a href="http://fontawesome.dashgame.com/#getstart">起步</a></li> <li class="dropdown-split-left"><a href="http://fontawesome.dashgame.com/#basic">示例</a></li> <li class="dropdown dropdown-split-right hidden-xs"> <a href="javascript:;" class="dropdown-toggle" data-toggle="dropdown"> <i class="fa fa-caret-down"></i> </a> <ul class="dropdown-menu pull-right"> <li class="dropdown-header">示例</li> <li class="divider"></li> <li><a href="http://fontawesome.dashgame.com/#basic">基本图标</a></li> <li><a href="http://fontawesome.dashgame.com/#larger">大图标</a></li> <li><a href="http://fontawesome.dashgame.com/#fixed-width">固定宽度</a></li> <li><a href="http://fontawesome.dashgame.com/#list">用于列表</a></li> <li><a href="http://fontawesome.dashgame.com/#bordered-pulled">边框与对齐</a></li> <li><a href="http://fontawesome.dashgame.com/#animated">动画</a></li> <li><a href="http://fontawesome.dashgame.com/#rotated-flipped">旋转与翻转</a></li> <li><a href="http://fontawesome.dashgame.com/#stacked">组合使用</a></li> <li><a href="http://fontawesome.dashgame.com/#bootstrap">Bootstrap 3 示例</a></li> <li><a href="http://fontawesome.dashgame.com/#custom">自定义CSS</a></li> </ul> </li> <li><a href="http://fontawesome.dashgame.com/#community">交流</a></li> <li><a href="http://fontawesome.dashgame.com/#license">许可协议</a></li> </ul> <ul class="nav navbar-nav navbar-right"> <li><a href="http://blog.fontawesome.io/" target="_blank">作者博客</a></li> <li><a href="http://www.dashgame.com/" target="_blank">极风游科技</a></li> </ul> </div> </div> </div> <div class="jumbotron jumbotron-carousel hidden-print"> <div class="container"> <div class="row"> <div class="col-md-8 col-sm-8 text-center"> <h1>Font Awesome</h1> <p>一套绝佳的图标字体库和CSS框架</p> <div class="actions"> <a class="btn btn-default btn-lg" href="http://fontawesome.dashgame.com/assets/font-awesome-4.7.0.zip"> <i class="fa fa-download fa-lg"></i>   立即下载 </a> </div> <div class="shameless-self-promotion"> Version 4.7.0   ·   <a href="https://github.com/FortAwesome/Font-Awesome" onclick="_gaq.push(['_trackEvent', 'Outbound Link', 'View Project on GitHub']);" target="_blank"> GitHub项目</a>   ·   <a href="http://fontawesome.io/3.2.1">Old 3.2.1 Docs</a>   ·   作者 <a href="http://twitter.com/davegandy" target="_blank">Dave Gandy</a> </div> </div> <div class="col-md-4 col-sm-4"> <div id="icon-carousel" class="carousel slide"> <div class="carousel-inner"> <div class="item"><div><i class="fa fa-font-awesome" aria-hidden="true"></i><span class="sr-only">flag icon</span></div></div> <div class="item"><div><i class="fa fa-universal-access" aria-hidden="true"></i><span class="sr-only">fort awesome icon</span></div></div> <div class="item"><div><i class="fa fa-fort-awesome" aria-hidden="true"></i><span class="sr-only">fort awesome icon</span></div></div> <div class="item"><div><i class="fa fa-commenting" aria-hidden="true"></i><span class="sr-only">commenting icon</span></div></div> <div class="item"><div><i class="fa fa-map-signs" aria-hidden="true"></i><span class="sr-only">map signs icon</span></div></div> <div class="item"><div><i class="fa fa-envelope" aria-hidden="true"></i><span class="sr-only">envelope icon</span></div></div> <div class="item"><div><i class="fa fa-send-o" aria-hidden="true"></i><span class="sr-only">send icon</span></div></div> <div class="item"><div><i class="fa fa-book" aria-hidden="true"></i><span class="sr-only">book icon</span></div></div> <div class="item"><div><i class="fa fa-fighter-jet" aria-hidden="true"></i><span class="sr-only">fighter jet icon</span></div></div> <div class="item"><div><i class="fa fa-beer" aria-hidden="true"></i><span class="sr-only">beer icon</span></div></div> <div class="item active"><div><i class="fa fa-heart-o" aria-hidden="true"></i><span class="sr-only">heart icon</span></div></div> <div class="item"><div><i class="fa fa-thumbs-o-up" aria-hidden="true"></i><span class="sr-only">thumbs up icon</span></div></div> <div class="item"><div><i class="fa fa-pied-piper-alt" aria-hidden="true"></i><span class="sr-only">pied piper icon</span></div></div> </div> <a class="carousel-control left" href="http://fontawesome.dashgame.com/#icon-carousel" data-slide="prev" onclick="_gaq.push(['_trackEvent', 'iconCarousel', 'Prev']);"> <i class="fa fa-arrow-circle-left" aria-hidden="true"></i> <span class="sr-only">Previous</span> </a> <a class="carousel-control right" href="http://fontawesome.dashgame.com/#icon-carousel" data-slide="next" onclick="_gaq.push(['_trackEvent', 'iconCarousel', 'Next']);"> <i class="fa fa-arrow-circle-right" aria-hidden="true"></i> <span class="sr-only">Next</span> </a> </div> </div> </div> </div> </div> <div class="container"> <section id="why" class="mainParts"> <section class="hidden-print"> <div class="stripe-ad row"> <p class="lead col-md-8"> Font Awesome为您提供可缩放的矢量图标，您可以使用CSS所提供的所有特性对它们进行更改，包括：大小、颜色、阴影或者其它任何支持的效果。 </p> <div id="carbonads" class="col-md-4"> <span class="carbon-wrap"> <a class="carbon-img col-md-3 hidden-sm hidden-xs" href="http://github.dashgame.com/" target="_blank"> <svg xmlns="http://www.w3.org/2000/svg" class="octicon octicon-mark-github" aria-hidden="true" viewBox="0 0 16 16" version="1.1"><path fill-rule="evenodd" d="M 8 0 C 3.58 0 0 3.58 0 8 c 0 3.54 2.29 6.53 5.47 7.59 c 0.4 0.07 0.55 -0.17 0.55 -0.38 c 0 -0.19 -0.01 -0.82 -0.01 -1.49 c -2.01 0.37 -2.53 -0.49 -2.69 -0.94 c -0.09 -0.23 -0.48 -0.94 -0.82 -1.13 c -0.28 -0.15 -0.68 -0.52 -0.01 -0.53 c 0.63 -0.01 1.08 0.58 1.23 0.82 c 0.72 1.21 1.87 0.87 2.33 0.66 c 0.07 -0.52 0.28 -0.87 0.51 -1.07 c -1.78 -0.2 -3.64 -0.89 -3.64 -3.95 c 0 -0.87 0.31 -1.59 0.82 -2.15 c -0.08 -0.2 -0.36 -1.02 0.08 -2.12 c 0 0 0.67 -0.21 2.2 0.82 c 0.64 -0.18 1.32 -0.27 2 -0.27 c 0.68 0 1.36 0.09 2 0.27 c 1.53 -1.04 2.2 -0.82 2.2 -0.82 c 0.44 1.1 0.16 1.92 0.08 2.12 c 0.51 0.56 0.82 1.27 0.82 2.15 c 0 3.07 -1.87 3.75 -3.65 3.95 c 0.29 0.25 0.54 0.73 0.54 1.48 c 0 1.07 -0.01 1.93 -0.01 2.2 c 0 0.21 0.15 0.46 0.55 0.38 A 8.013 8.013 0 0 0 16 8 c 0 -4.42 -3.58 -8 -8 -8 Z"></path></svg> </a> <a class="carbon-text col-md-9 col-xs-12" href="http://github.dashgame.com/" target="_blank"> <h4>Github热门</h4> <p>一起来探索GitHub上最热门的项目吧！</p> </a> </span> </div> </div> </section> <div class="clearfix"></div> <section class="feature-list"> <div class="row"> <div class="col-md-4 col-sm-6"> <h4><i class="fa fa-flag"></i> 一个字库，675个图标</h4> 仅一个Font Awesome字库，就包含了与网页相关的所有形象图标。 </div> <div class="col-md-4 col-sm-6"> <h4><i class="fa fa-ban"></i> 无需依赖JavaScript</h4> Font Awesome完全不依赖JavaScript，因此无需担心兼容性。 </div> <div class="col-md-4 col-sm-6"> <h4><i class="fa fa-arrows-alt"></i> 无限缩放</h4> 无论在任何尺寸下，可缩放的矢量图形都会为您呈现出完美的图标。 </div> <div class="col-md-4 col-sm-6"> <h4><i class="fa fa-microphone"></i> 如言语一般自由</h4> Font Awesome完全免费，哪怕是商业用途。请查看<a href="http://fontawesome.dashgame.com/#license">许可</a>。 </div> <div class="col-md-4 col-sm-6"> <h4><i class="fa fa-pencil"></i> CSS控制</h4> 只要CSS支持，无论颜色、大小、阴影或者其它任何效果，都可以轻易展现。 </div> <div class="col-md-4 col-sm-6"> <h4><i class="fa fa-eye"></i> 高分屏完美呈现</h4> Font Awesome的矢量图标，将使您的网站在视网膜级的高分屏上大放异彩。 </div> <div class="col-md-4 col-sm-6"> <h4><i class="fa fa-gamepad"></i> 完美兼容其它框架</h4> 尽管是为<a href="http://getbootstrap.com/">Bootstrap</a>设计，但Font Awesome同样能与其它框架完美协同运作。 </div> <div class="col-md-4 col-sm-6"> <h4><i class="fa fa-desktop"></i> 可用于桌面系统</h4> 用于桌面系统，或需要一套完整的矢量图，请查看<a href="http://fontawesome.io/cheatsheet/" target="_blank">备忘</a>。 </div> <div class="col-md-4 col-sm-6"> <h4><i class="fa fa-search"></i> 可适配于屏幕阅读器</h4> 与其它字体不同，Font Awesome不会影响屏幕阅读器正常工作。 </div> </div> </section> <div class="clearfix"></div> <div class="baidushare"> <div class="pull-left"><i class="fa fa-share-alt"></i> 分享给朋友</div> <div class="bdsharebuttonbox pull-left bdshare-button-style2-16" data-bd-bind="1518089959092"><a href="http://fontawesome.dashgame.com/#" class="bds_tsina" data-cmd="tsina" title="分享到新浪微博"></a><a href="http://fontawesome.dashgame.com/#" class="bds_tqq" data-cmd="tqq" title="分享到腾讯微博"></a><a href="http://fontawesome.dashgame.com/#" class="bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a><a href="http://fontawesome.dashgame.com/#" class="bds_renren" data-cmd="renren" title="分享到人人网"></a><a href="http://fontawesome.dashgame.com/#" class="bds_douban" data-cmd="douban" title="分享到豆瓣网"></a><a href="http://fontawesome.dashgame.com/#" class="bds_diandian" data-cmd="diandian" title="分享到点点网"></a><a href="http://fontawesome.dashgame.com/#" class="bds_more" data-cmd="more"></a></div> <script>window._bd_share_config={"common":{"bdSnsKey":{},"bdText":"","bdMini":"2","bdMiniList":false,"bdPic":"","bdStyle":"2","bdSize":"16"},"share":{}};with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion='+~(-new Date()/36e5)];</script> </div> </section> <div id="new" class="mainParts"> <h2 class="page-header">4.7.0版新增41个全新的图标</h2> <div class="row fontawesome-icon-list"> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-address-book" aria-hidden="true"></i> <span class="sr-only">Example of </span>address-book</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-address-book-o" aria-hidden="true"></i> <span class="sr-only">Example of </span>address-book-o</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-address-card" aria-hidden="true"></i> <span class="sr-only">Example of </span>address-card</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-address-card-o" aria-hidden="true"></i> <span class="sr-only">Example of </span>address-card-o</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-bandcamp" aria-hidden="true"></i> <span class="sr-only">Example of </span>bandcamp</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-bath" aria-hidden="true"></i> <span class="sr-only">Example of </span>bath</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-bathtub" aria-hidden="true"></i> <span class="sr-only">Example of </span>bathtub <span class="text-muted">(alias)</span></a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-drivers-license" aria-hidden="true"></i> <span class="sr-only">Example of </span>drivers-license <span class="text-muted">(alias)</span></a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-drivers-license-o" aria-hidden="true"></i> <span class="sr-only">Example of </span>drivers-license-o <span class="text-muted">(alias)</span></a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-eercast" aria-hidden="true"></i> <span class="sr-only">Example of </span>eercast</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-envelope-open" aria-hidden="true"></i> <span class="sr-only">Example of </span>envelope-open</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-envelope-open-o" aria-hidden="true"></i> <span class="sr-only">Example of </span>envelope-open-o</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-etsy" aria-hidden="true"></i> <span class="sr-only">Example of </span>etsy</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-free-code-camp" aria-hidden="true"></i> <span class="sr-only">Example of </span>free-code-camp</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-grav" aria-hidden="true"></i> <span class="sr-only">Example of </span>grav</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-handshake-o" aria-hidden="true"></i> <span class="sr-only">Example of </span>handshake-o</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-id-badge" aria-hidden="true"></i> <span class="sr-only">Example of </span>id-badge</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-id-card" aria-hidden="true"></i> <span class="sr-only">Example of </span>id-card</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-id-card-o" aria-hidden="true"></i> <span class="sr-only">Example of </span>id-card-o</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-imdb" aria-hidden="true"></i> <span class="sr-only">Example of </span>imdb</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-linode" aria-hidden="true"></i> <span class="sr-only">Example of </span>linode</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-meetup" aria-hidden="true"></i> <span class="sr-only">Example of </span>meetup</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-microchip" aria-hidden="true"></i> <span class="sr-only">Example of </span>microchip</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-podcast" aria-hidden="true"></i> <span class="sr-only">Example of </span>podcast</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-quora" aria-hidden="true"></i> <span class="sr-only">Example of </span>quora</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-ravelry" aria-hidden="true"></i> <span class="sr-only">Example of </span>ravelry</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-s15" aria-hidden="true"></i> <span class="sr-only">Example of </span>s15 <span class="text-muted">(alias)</span></a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-shower" aria-hidden="true"></i> <span class="sr-only">Example of </span>shower</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-snowflake-o" aria-hidden="true"></i> <span class="sr-only">Example of </span>snowflake-o</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-superpowers" aria-hidden="true"></i> <span class="sr-only">Example of </span>superpowers</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-telegram" aria-hidden="true"></i> <span class="sr-only">Example of </span>telegram</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-thermometer" aria-hidden="true"></i> <span class="sr-only">Example of </span>thermometer <span class="text-muted">(alias)</span></a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-thermometer-0" aria-hidden="true"></i> <span class="sr-only">Example of </span>thermometer-0 <span class="text-muted">(alias)</span></a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-thermometer-1" aria-hidden="true"></i> <span class="sr-only">Example of </span>thermometer-1 <span class="text-muted">(alias)</span></a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-thermometer-2" aria-hidden="true"></i> <span class="sr-only">Example of </span>thermometer-2 <span class="text-muted">(alias)</span></a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-thermometer-3" aria-hidden="true"></i> <span class="sr-only">Example of </span>thermometer-3 <span class="text-muted">(alias)</span></a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-thermometer-4" aria-hidden="true"></i> <span class="sr-only">Example of </span>thermometer-4 <span class="text-muted">(alias)</span></a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-thermometer-empty" aria-hidden="true"></i> <span class="sr-only">Example of </span>thermometer-empty</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-thermometer-full" aria-hidden="true"></i> <span class="sr-only">Example of </span>thermometer-full</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-thermometer-half" aria-hidden="true"></i> <span class="sr-only">Example of </span>thermometer-half</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-thermometer-quarter" aria-hidden="true"></i> <span class="sr-only">Example of </span>thermometer-quarter</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-thermometer-three-quarters" aria-hidden="true"></i> <span class="sr-only">Example of </span>thermometer-three-quarters</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-times-rectangle" aria-hidden="true"></i> <span class="sr-only">Example of </span>times-rectangle <span class="text-muted">(alias)</span></a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-times-rectangle-o" aria-hidden="true"></i> <span class="sr-only">Example of </span>times-rectangle-o <span class="text-muted">(alias)</span></a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-user-circle" aria-hidden="true"></i> <span class="sr-only">Example of </span>user-circle</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-user-circle-o" aria-hidden="true"></i> <span class="sr-only">Example of </span>user-circle-o</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-user-o" aria-hidden="true"></i> <span class="sr-only">Example of </span>user-o</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-vcard" aria-hidden="true"></i> <span class="sr-only">Example of </span>vcard <span class="text-muted">(alias)</span></a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-vcard-o" aria-hidden="true"></i> <span class="sr-only">Example of </span>vcard-o <span class="text-muted">(alias)</span></a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-window-close" aria-hidden="true"></i> <span class="sr-only">Example of </span>window-close</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-window-close-o" aria-hidden="true"></i> <span class="sr-only">Example of </span>window-close-o</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-window-maximize" aria-hidden="true"></i> <span class="sr-only">Example of </span>window-maximize</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-window-minimize" aria-hidden="true"></i> <span class="sr-only">Example of </span>window-minimize</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-window-restore" aria-hidden="true"></i> <span class="sr-only">Example of </span>window-restore</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-wpexplorer" aria-hidden="true"></i> <span class="sr-only">Example of </span>wpexplorer</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> </div> </div> <div> <section id="web-application" class="mainParts"> <h2 class="page-header">网页</h2> <div class="row fontawesome-icon-list"> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-address-book" aria-hidden="true"></i> <span class="sr-only">Example of </span>address-book</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-address-book-o" aria-hidden="true"></i> <span class="sr-only">Example of </span>address-book-o</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-address-card" aria-hidden="true"></i> <span class="sr-only">Example of </span>address-card</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-address-card-o" aria-hidden="true"></i> <span class="sr-only">Example of </span>address-card-o</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-adjust" aria-hidden="true"></i> <span class="sr-only">Example of </span>adjust</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-american-sign-language-interpreting" aria-hidden="true"></i> <span class="sr-only">Example of </span>american-sign-language-interpreting</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-anchor" aria-hidden="true"></i> <span class="sr-only">Example of </span>anchor</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-archive" aria-hidden="true"></i> <span class="sr-only">Example of </span>archive</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-area-chart" aria-hidden="true"></i> <span class="sr-only">Example of </span>area-chart</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-arrows" aria-hidden="true"></i> <span class="sr-only">Example of </span>arrows</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-arrows-h" aria-hidden="true"></i> <span class="sr-only">Example of </span>arrows-h</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-arrows-v" aria-hidden="true"></i> <span class="sr-only">Example of </span>arrows-v</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-asl-interpreting" aria-hidden="true"></i> <span class="sr-only">Example of </span>asl-interpreting <span class="text-muted">(alias)</span></a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-assistive-listening-systems" aria-hidden="true"></i> <span class="sr-only">Example of </span>assistive-listening-systems</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-asterisk" aria-hidden="true"></i> <span class="sr-only">Example of </span>asterisk</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-at" aria-hidden="true"></i> <span class="sr-only">Example of </span>at</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-audio-description" aria-hidden="true"></i> <span class="sr-only">Example of </span>audio-description</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-automobile" aria-hidden="true"></i> <span class="sr-only">Example of </span>automobile <span class="text-muted">(alias)</span></a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-balance-scale" aria-hidden="true"></i> <span class="sr-only">Example of </span>balance-scale</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-ban" aria-hidden="true"></i> <span class="sr-only">Example of </span>ban</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-bank" aria-hidden="true"></i> <span class="sr-only">Example of </span>bank <span class="text-muted">(alias)</span></a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-bar-chart" aria-hidden="true"></i> <span class="sr-only">Example of </span>bar-chart</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-bar-chart-o" aria-hidden="true"></i> <span class="sr-only">Example of </span>bar-chart-o <span class="text-muted">(alias)</span></a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-barcode" aria-hidden="true"></i> <span class="sr-only">Example of </span>barcode</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-bars" aria-hidden="true"></i> <span class="sr-only">Example of </span>bars</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-bath" aria-hidden="true"></i> <span class="sr-only">Example of </span>bath</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-bathtub" aria-hidden="true"></i> <span class="sr-only">Example of </span>bathtub <span class="text-muted">(alias)</span></a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-battery" aria-hidden="true"></i> <span class="sr-only">Example of </span>battery <span class="text-muted">(alias)</span></a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-battery-0" aria-hidden="true"></i> <span class="sr-only">Example of </span>battery-0 <span class="text-muted">(alias)</span></a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-battery-1" aria-hidden="true"></i> <span class="sr-only">Example of </span>battery-1 <span class="text-muted">(alias)</span></a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-battery-2" aria-hidden="true"></i> <span class="sr-only">Example of </span>battery-2 <span class="text-muted">(alias)</span></a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-battery-3" aria-hidden="true"></i> <span class="sr-only">Example of </span>battery-3 <span class="text-muted">(alias)</span></a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-battery-4" aria-hidden="true"></i> <span class="sr-only">Example of </span>battery-4 <span class="text-muted">(alias)</span></a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-battery-empty" aria-hidden="true"></i> <span class="sr-only">Example of </span>battery-empty</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-battery-full" aria-hidden="true"></i> <span class="sr-only">Example of </span>battery-full</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-battery-half" aria-hidden="true"></i> <span class="sr-only">Example of </span>battery-half</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-battery-quarter" aria-hidden="true"></i> <span class="sr-only">Example of </span>battery-quarter</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-battery-three-quarters" aria-hidden="true"></i> <span class="sr-only">Example of </span>battery-three-quarters</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-bed" aria-hidden="true"></i> <span class="sr-only">Example of </span>bed</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-beer" aria-hidden="true"></i> <span class="sr-only">Example of </span>beer</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-bell" aria-hidden="true"></i> <span class="sr-only">Example of </span>bell</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i class="fa fa-bell-o" aria-hidden="true"></i> <span class="sr-only">Example of </span>bell-o</a><span class="clipboard text-muted" style="line-height: 32px;"><i class="fa fa-clipboard"></i></span></div> <div class="fa-hover col-md-3 col-sm-4"><a class="col-xs-11"><i