font-awesome图标使用教程，轻松复制代码即可使用，用于网站，增加美观度。本人花费2小时整理，只为您5秒就可以使用font-awesome所带来的乐趣。目前本页使用的是4.7版的插件，请勿使用高版本的进行测试。临近版应该没有问题
请勿在IE7 及以下版本浏览器中测试。 全部图标代码在下面
用于列表：使用 fa-ul 和 fa-li 便可以简单的将无序列表的默认符号替换掉。
使用 fa-lg (33%递增)、fa-2x、 fa-3x、fa-4x，或者 fa-5x 类 来放大图标。
fa-lg fa-2x fa-3x fa-4x fa-5x
使用 fa-fw 可以将图标设置为一个固定宽度。主要用于不同宽度图标无法对齐的情况。 尤其在列表或导航时起到重要作用。
使用 fa-border 以及 pull-right 或 pull-left 可以轻易构造出引用的特殊效果。
Font awesome是一种用字体来实现图标的CSS插件。Font Awesome为您提供可缩放的矢量图标，您可以使用CSS所提供的所有特性对它们进行更改，包括：大小、颜色、阴影或者其它任何支持的效果。Font Awesome已经为你准备了将近500个常用icon图标（还在不断更新），能大能小，能随便修改颜色，完全开源，完全免费。可以让程序员完全避免搞美工图片的困境！
使用 fa-spin 类来使任意图标旋转，现在您还可以使用 fa-pulse 来使其进行8方位旋转。尤其适合 fa-spinner、fa-refresh 和 fa-cog CSS3动画不支持IE8-IE9。
使用 fa-rotate-* 和 fa-flip-* 类可以对图标进行任意旋转和翻转。
normal fa-rotate-90 fa-rotate-180 fa-rotate-270 fa-flip-horizontal icon-flip-vertical
如果想要将多个图标组合起来，使用 fa-stack 类作为父容器， fa-stack-1x 作为正常比例的图标， fa-stack-2x 作为大一些的图标。还可以使用 fa-inverse 类来切换图标颜色。您可以在父容器中 通过添加 大图标 类来控制整体大小。
fa-twitter on fa-square-o fa-flag on fa-circle fa-terminal on fa-square fa-ban on fa-camera
网站头部 先引用以下两个文件任意一个
在css文件中引用【font-awesome】后可以这样：
.panel-default>.panel-heading a::after{
font-family:"fontawesome";
content:"\f113";
position:absolute;
right:15px;
font-size:14px;
}
主要看这个代码 content:"\f113"
<i class="fa fa-terminal"> </i> fa-terminal 替换代码 图标对应的代码，比如： fa-glass 假如需要增加颜色，可以用CSS控制。
如果你还不会，够菜的，那么直接查看本页源码。
| NAME | CODE | NAME | CODE |
|---|---|---|---|
| fa-glass | \f000 | fa-github-alt | \f113 |
| fa-music | \f001 | fa-folder-o | \f114 |
| fa-search | \f002 | fa-folder-open-o | \f115 |
| fa-envelope-o | \f003 | fa-smile-o | \f118 |
| fa-heart | \f004 | fa-frown-o | \f119 |
| fa-star | \f005 | fa-meh-o | \f11a |
| fa-star-o | \f006 | fa-gamepad | \f11b |
| fa-user | \f007 | fa-keyboard-o | \f11c |
| fa-film | \f008 | fa-flag-o | \f11d |
| fa-th-large | \f009 | fa-flag-checkered | \f11e |
| fa-th | \f00a | fa-terminal | \f120 |
| fa-th-list | \f00b | fa-code | \f121 |
| fa-check | \f00c | fa-mail-reply-all | \f122 |
| fa-remove | \f00d | fa-reply-all | \f122 |
| fa-close | \f00d | fa-star-half-empty | \f123 |
| fa-times | \f00d | fa-star-half-full | \f123 |
| fa-search-plus | \f00e | fa-star-half-o | \f123 |
| fa-search-minus | \f010 | fa-location-arrow | \f124 |
| fa-power-off | \f011 | fa-crop | \f125 |
| fa-signal | \f012 | fa-code-fork | \f126 |
| fa-gear | \f013 | fa-unlink | \f127 |
| fa-cog | \f013 | fa-chain-broken | \f127 |
| fa-trash-o | \f014 | fa-question | \f128 |
| fa-home | \f015 | fa-info | \f129 |
| fa-file-o | \f016 | fa-exclamation | \f12a |
| fa-clock-o | \f017 | fa-superscript | \f12b |
| fa-road | \f018 | fa-subscript | \f12c |
| fa-download | \f019 | fa-eraser | \f12d |
| fa-arrow-circle-o-down | \f01a | fa-puzzle-piece | \f12e |
| fa-arrow-circle-o-up | \f01b | fa-microphone | \f130 |
| fa-inbox | \f01c | fa-microphone-slash | \f131 |
| fa-play-circle-o | \f01d | fa-shield | \f132 |
| fa-rotate-right | \f01e | fa-calendar-o | \f133 |
| fa-repeat | \f01e | fa-fire-extinguisher | \f134 |
| fa-refresh | \f021 | fa-rocket | \f135 |
| fa-list-alt | \f022 | fa-maxcdn | \f136 |
| fa-lock | \f023 | fa-chevron-circle-left | \f137 |
| fa-flag | \f024 | fa-chevron-circle-right | \f138 |
| fa-headphones | \f025 | fa-chevron-circle-up | \f139 |
| fa-volume-off | \f026 | fa-chevron-circle-down | \f13a |
| fa-volume-down | \f027 | fa-html5 | \f13b |
| fa-volume-up | \f028 | fa-css3 | \f13c |
| fa-qrcode | \f029 | fa-anchor | \f13d |
| fa-barcode | \f02a | fa-unlock-alt | \f13e |
| fa-tag | \f02b | fa-bullseye | \f140 |
| fa-tags | \f02c | fa-ellipsis-h | \f141 |
| fa-book | \f02d | fa-ellipsis-v | \f142 |
| fa-bookmark | \f02e | fa-rss-square | \f143 |
| fa-print | \f02f | fa-play-circle | \f144 |
| fa-camera | \f030 | fa-ticket | \f145 |
| fa-font | \f031 | fa-minus-square | \f146 |
| fa-bold | \f032 | fa-minus-square-o | \f147 |
| fa-italic | \f033 | fa-level-up | \f148 |
| fa-text-height | \f034 | fa-level-down | \f149 |
| fa-text-width | \f035 | fa-check-square | \f14a |
| fa-align-left | \f036 | fa-pencil-square | \f14b |
| fa-align-center | \f037 | fa-external-link-square | \f14c |
| fa-align-right | \f038 | fa-share-square | \f14d |
| fa-align-justify | \f039 | fa-compass | \f14e |
| fa-list | \f03a | fa-toggle-down | \f150 |
| fa-dedent | \f03b | fa-caret-square-o-down | \f150 |
| fa-outdent | \f03b | fa-toggle-up | \f151 |
| fa-indent | \f03c | fa-caret-square-o-up | \f151 |
| fa-video-camera | \f03d | fa-toggle-right | \f152 |
| fa-photo | \f03e | fa-caret-square-o-right | \f152 |
| fa-image | \f03e | fa-euro | \f153 |
| fa-picture-o | \f03e | fa-eur | \f153 |
| fa-pencil | \f040 | fa-gbp | \f154 |
| fa-map-marker | \f041 | fa-dollar | \f155 |
| fa-adjust | \f042 | fa-usd | \f155 |
| fa-tint | \f043 | fa-rupee | \f156 |
| fa-edit | \f044 | fa-inr | \f156 |
| fa-pencil-square-o | \f044 | fa-cny | \f157 |
| fa-share-square-o | \f045 | fa-rmb | \f157 |
| fa-check-square-o | \f046 | fa-yen | \f157 |
| fa-arrows | \f047 | fa-jpy | \f157 |
| fa-step-backward | \f048 | fa-ruble | \f158 |
| fa-fast-backward | \f049 | fa-rouble | \f158 |
| fa-backward | \f04a | fa-rub | \f158 |
| fa-play | \f04b | fa-won | \f159 |
| fa-pause | \f04c | fa-krw | \f159 |
| fa-stop | \f04d | fa-bitcoin | \f15a |
| fa-forward | \f04e | fa-btc | \f15a |
| fa-fast-forward | \f050 | fa-file | \f15b |
| fa-step-forward | \f051 | fa-file-text | \f15c |
| fa-eject | \f052 | fa-sort-alpha-asc | \f15d |
| fa-chevron-left | \f053 | fa-sort-alpha-desc | \f15e |
| fa-chevron-right | \f054 | fa-sort-amount-asc | \f160 |
| fa-plus-circle | \f055 | fa-sort-amount-desc | \f161 |
| fa-minus-circle | \f056 | fa-sort-numeric-asc | \f162 |
| fa-times-circle | \f057 | fa-sort-numeric-desc | \f163 |
| fa-check-circle | \f058 | fa-thumbs-up | \f164 |
| fa-question-circle | \f059 | fa-thumbs-down | \f165 |
| fa-info-circle | \f05a | fa-youtube-square | \f166 |
| fa-crosshairs | \f05b | fa-youtube | \f167 |
| fa-times-circle-o | \f05c | fa-xing | \f168 |
| fa-check-circle-o | \f05d | fa-xing-square | \f169 |
| fa-ban | \f05e | fa-youtube-play | \f16a |
| fa-arrow-left | \f060 | fa-dropbox | \f16b |
| fa-arrow-right | \f061 | fa-stack-overflow | \f16c |
| fa-arrow-up | \f062 | fa-instagram | \f16d |
| fa-arrow-down | \f063 | fa-flickr | \f16e |
| fa-mail-forward | \f064 | fa-adn | \f170 |
| fa-share | \f064 | fa-bitbucket | \f171 |
| fa-expand | \f065 | fa-bitbucket-square | \f172 |
| fa-compress | \f066 | fa-tumblr | \f173 |
| fa-plus | \f067 | fa-tumblr-square | \f174 |
| fa-minus | \f068 | fa-long-arrow-down | \f175 |
| fa-asterisk | \f069 | fa-long-arrow-up | \f176 |
| fa-exclamation-circle | \f06a | fa-long-arrow-left | \f177 |
| fa-gift | \f06b | fa-long-arrow-right | \f178 |
| fa-leaf | \f06c | fa-apple | \f179 |
| fa-fire | \f06d | fa-windows | \f17a |
| fa-eye | \f06e | fa-android | \f17b |
| fa-eye-slash | \f070 | fa-linux | \f17c |
| fa-warning | \f071 | fa-dribbble | \f17d |
| fa-exclamation-triangle | \f071 | fa-skype | \f17e |
| fa-plane | \f072 | fa-foursquare | \f180 |
| fa-calendar | \f073 | fa-trello | \f181 |
| fa-random | \f074 | fa-female | \f182 |
| fa-comment | \f075 | fa-male | \f183 |
| fa-magnet | \f076 | fa-gittip | \f184 |
| fa-chevron-up | \f077 | fa-sun-o | \f185 |
| fa-chevron-down | \f078 | fa-moon-o | \f186 |
| fa-retweet | \f079 | fa-archive | \f187 |
| fa-shopping-cart | \f07a | fa-bug | \f188 |
| fa-folder | \f07b | fa-vk | \f189 |
| fa-folder-open | \f07c | fa-weibo | \f18a |
| fa-arrows-v | \f07d | fa-renren | \f18b |
| fa-arrows-h | \f07e | fa-pagelines | \f18c |
| fa-bar-chart-o | \f080 | fa-stack-exchange | \f18d |
| fa-bar-chart | \f080 | fa-arrow-circle-o-right | \f18e |
| fa-twitter-square | \f081 | fa-arrow-circle-o-left | \f190 |
| fa-facebook-square | \f082 | fa-toggle-left | \f191 |
| fa-camera-retro | \f083 | fa-caret-square-o-left | \f191 |
| fa-key | \f084 | fa-dot-circle-o | \f192 |
| fa-gears | \f085 | fa-wheelchair | \f193 |
| fa-cogs | \f085 | fa-vimeo-square | \f194 |
| fa-comments | \f086 | fa-turkish-lira | \f195 |
| fa-thumbs-o-up | \f087 | fa-try | \f195 |
| fa-thumbs-o-down | \f088 | fa-plus-square-o | \f196 |
| fa-star-half | \f089 | fa-space-shuttle | \f197 |
| fa-heart-o | \f08a | fa-slack | \f198 |
| fa-sign-out | \f08b | fa-envelope-square | \f199 |
| fa-linkedin-square | \f08c | fa-wordpress | \f19a |
| fa-thumb-tack | \f08d | fa-openid | \f19b |
| fa-external-link | \f08e | fa-institution | \f19c |
| fa-sign-in | \f090 | fa-bank | \f19c |
| fa-trophy | \f091 | fa-university | \f19c |
| fa-github-square | \f092 | fa-mortar-board | \f19d |
| fa-upload | \f093 | fa-graduation-cap | \f19d |
| fa-lemon-o | \f094 | fa-yahoo | \f19e |
| fa-phone | \f095 | fa-google | \f1a0 |
| fa-square-o | \f096 | fa-reddit | \f1a1 |
| fa-bookmark-o | \f097 | fa-reddit-square | \f1a2 |
| fa-phone-square | \f098 | fa-stumbleupon-circle | \f1a3 |
| fa-twitter | \f099 | fa-stumbleupon | \f1a4 |
| fa-facebook | \f09a | fa-delicious | \f1a5 |
| fa-github | \f09b | fa-digg | \f1a6 |
| fa-unlock | \f09c | fa-pied-piper | \f1a7 |
| fa-credit-card | \f09d | fa-pied-piper-alt | \f1a8 |
| fa-rss | \f09e | fa-drupal | \f1a9 |
| fa-hdd-o | \f0a0 | fa-joomla | \f1aa |
| fa-bullhorn | \f0a1 | fa-language | \f1ab |
| fa-bell | \f0f3 | fa-fax | \f1ac |
| fa-certificate | \f0a3 | fa-building | \f1ad |
| fa-hand-o-right | \f0a4 | fa-child | \f1ae |
| fa-hand-o-left | \f0a5 | fa-paw | \f1b0 |
| fa-hand-o-up | \f0a6 | fa-spoon | \f1b1 |
| fa-hand-o-down | \f0a7 | fa-cube | \f1b2 |
| fa-arrow-circle-left | \f0a8 | fa-cubes | \f1b3 |
| fa-arrow-circle-right | \f0a9 | fa-behance | \f1b4 |
| fa-arrow-circle-up | \f0aa | fa-behance-square | \f1b5 |
| fa-arrow-circle-down | \f0ab | fa-steam | \f1b6 |
| fa-globe | \f0ac | fa-steam-square | \f1b7 |
| fa-wrench | \f0ad | fa-recycle | \f1b8 |
| fa-tasks | \f0ae | fa-automobile | \f1b9 |
| fa-filter | \f0b0 | fa-car | \f1b9 |
| fa-briefcase | \f0b1 | fa-cab | \f1ba |
| fa-arrows-alt | \f0b2 | fa-taxi | \f1ba |
| fa-group | \f0c0 | fa-tree | \f1bb |
| fa-users | \f0c0 | fa-spotify | \f1bc |
| fa-chain | \f0c1 | fa-deviantart | \f1bd |
| fa-link | \f0c1 | fa-soundcloud | \f1be |
| fa-cloud | \f0c2 | fa-database | \f1c0 |
| fa-flask | \f0c3 | fa-file-pdf-o | \f1c1 |
| fa-cut | \f0c4 | fa-file-word-o | \f1c2 |
| fa-scissors | \f0c4 | fa-file-excel-o | \f1c3 |
| fa-copy | \f0c5 | fa-file-powerpoint-o | \f1c4 |
| fa-files-o | \f0c5 | fa-file-photo-o | \f1c5 |
| fa-paperclip | \f0c6 | fa-file-picture-o | \f1c5 |
| fa-save | \f0c7 | fa-file-image-o | \f1c5 |
| fa-floppy-o | \f0c7 | fa-file-zip-o | \f1c6 |
| fa-square | \f0c8 | fa-file-archive-o | \f1c6 |
| fa-navicon | \f0c9 | fa-file-sound-o | \f1c7 |
| fa-reorder | \f0c9 | fa-file-audio-o | \f1c7 |
| fa-bars | \f0c9 | fa-file-movie-o | \f1c8 |
| fa-list-ul | \f0ca | fa-file-video-o | \f1c8 |
| fa-list-ol | \f0cb | fa-file-code-o | \f1c9 |
| fa-strikethrough | \f0cc | fa-vine | \f1ca |
| fa-underline | \f0cd | fa-codepen | \f1cb |
| fa-table | \f0ce | fa-jsfiddle | \f1cc |
| fa-magic | \f0d0 | fa-life-bouy | \f1cd |
| fa-truck | \f0d1 | fa-life-buoy | \f1cd |
| fa-pinterest | \f0d2 | fa-life-saver | \f1cd |
| fa-pinterest-square | \f0d3 | fa-support | \f1cd |
| fa-google-plus-square | \f0d4 | fa-life-ring | \f1cd |
| fa-google-plus | \f0d5 | fa-circle-o-notch | \f1ce |
| fa-money | \f0d6 | fa-ra | \f1d0 |
| fa-caret-down | \f0d7 | fa-rebel | \f1d0 |
| fa-caret-up | \f0d8 | fa-ge | \f1d1 |
| fa-caret-left | \f0d9 | fa-empire | \f1d1 |
| fa-caret-right | \f0da | fa-git-square | \f1d2 |
| fa-columns | \f0db | fa-git | \f1d3 |
| fa-unsorted | \f0dc | fa-hacker-news | \f1d4 |
| fa-sort | \f0dc | fa-tencent-weibo | \f1d5 |
| fa-sort-down | \f0dd | fa-qq | \f1d6 |
| fa-sort-desc | \f0dd | fa-wechat | \f1d7 |
| fa-sort-up | \f0de | fa-weixin | \f1d7 |
| fa-sort-asc | \f0de | fa-send | \f1d8 |
| fa-envelope | \f0e0 | fa-paper-plane | \f1d8 |
| fa-linkedin | \f0e1 | fa-send-o | \f1d9 |
| fa-rotate-left | \f0e2 | fa-paper-plane-o | \f1d9 |
| fa-undo | \f0e2 | fa-history | \f1da |
| fa-legal | \f0e3 | fa-circle-thin | \f1db |
| fa-gavel | \f0e3 | fa-header | \f1dc |
| fa-dashboard | \f0e4 | fa-paragraph | \f1dd |
| fa-tachometer | \f0e4 | fa-sliders | \f1de |
| fa-comment-o | \f0e5 | fa-share-alt | \f1e0 |
| fa-comments-o | \f0e6 | fa-share-alt-square | \f1e1 |
| fa-flash | \f0e7 | fa-bomb | \f1e2 |
| fa-bolt | \f0e7 | fa-soccer-ball-o | \f1e3 |
| fa-sitemap | \f0e8 | fa-futbol-o | \f1e3 |
| fa-umbrella | \f0e9 | fa-tty | \f1e4 |
| fa-paste | \f0ea | fa-binoculars | \f1e5 |
| fa-clipboard | \f0ea | fa-plug | \f1e6 |
| fa-lightbulb-o | \f0eb | fa-slideshare | \f1e7 |
| fa-exchange | \f0ec | fa-twitch | \f1e8 |
| fa-cloud-download | \f0ed | fa-yelp | \f1e9 |
| fa-cloud-upload | \f0ee | fa-newspaper-o | \f1ea |
| fa-user-md | \f0f0 | fa-wifi | \f1eb |
| fa-stethoscope | \f0f1 | fa-calculator | \f1ec |
| fa-suitcase | \f0f2 | fa-paypal | \f1ed |
| fa-bell-o | \f0a2 | fa-google-wallet | \f1ee |
| fa-coffee | \f0f4 | fa-cc-visa | \f1f0 |
| fa-cutlery | \f0f5 | fa-cc-mastercard | \f1f1 |
| fa-file-text-o | \f0f6 | fa-cc-discover | \f1f2 |
| fa-building-o | \f0f7 | fa-cc-amex | \f1f3 |
| fa-hospital-o | \f0f8 | fa-cc-paypal | \f1f4 |
| fa-ambulance | \f0f9 | fa-cc-stripe | \f1f5 |
| fa-medkit | \f0fa | fa-bell-slash | \f1f6 |
| fa-fighter-jet | \f0fb | fa-bell-slash-o | \f1f7 |
| fa-beer | \f0fc | fa-trash | \f1f8 |
| fa-h-square | \f0fd | fa-copyright | \f1f9 |
| fa-plus-square | \f0fe | fa-at | \f1fa |
| fa-angle-double-left | \f100 | fa-eyedropper | \f1fb |
| fa-angle-double-right | \f101 | fa-paint-brush | \f1fc |
| fa-angle-double-up | \f102 | fa-birthday-cake | \f1fd |
| fa-angle-double-down | \f103 | fa-area-chart | \f1fe |
如果你喜欢这里记得收藏哟，随时备用。