×

Bootstrap Glyphicons 图标

admin admin 发表于2015-12-10 11:03:07 浏览2712 评论0

抢沙发发表评论

可用的图标

包括 200 个来自 Glyphicon Halflings 的字体图标。Glyphicons Halflings 一般不允许免费使用,但是他们的作者允许 Bootstrap 免费使用。为了表示感谢,希望你在使用时加上 Glyphicons 的链接。


  •        glyphicon glyphicon-adjust


  •        glyphicon glyphicon-align-center


  •        glyphicon glyphicon-align-justify


  •        glyphicon glyphicon-align-left


  •        glyphicon glyphicon-align-right


  •        glyphicon glyphicon-arrow-down


  •        glyphicon glyphicon-arrow-left


  •        glyphicon glyphicon-arrow-right


  •        glyphicon glyphicon-arrow-up


  •        glyphicon glyphicon-asterisk


  •        glyphicon glyphicon-backward


  •        glyphicon glyphicon-ban-circle


  •        glyphicon glyphicon-barcode


  •        glyphicon glyphicon-bell


  •        glyphicon glyphicon-bold


  •        glyphicon glyphicon-book


  •        glyphicon glyphicon-bookmark


  •        glyphicon glyphicon-briefcase


  •        glyphicon glyphicon-bullhorn


  •        glyphicon glyphicon-calendar


  •        glyphicon glyphicon-camera


  •        glyphicon glyphicon-certificate


  •        glyphicon glyphicon-check


  •        glyphicon glyphicon-chevron-down


  •        glyphicon glyphicon-chevron-left


  •        glyphicon glyphicon-chevron-right


  •        glyphicon glyphicon-chevron-up


  •        glyphicon glyphicon-circle-arrow-down


  •        glyphicon glyphicon-circle-arrow-left


  •        glyphicon glyphicon-circle-arrow-right


  •        glyphicon glyphicon-circle-arrow-up


  •        glyphicon glyphicon-cloud


  •        glyphicon glyphicon-cloud-download


  •        glyphicon glyphicon-cloud-upload


  •        glyphicon glyphicon-cog


  •        glyphicon glyphicon-collapse-down


  •        glyphicon glyphicon-collapse-up


  •        glyphicon glyphicon-comment


  •        glyphicon glyphicon-compressed


  •        glyphicon glyphicon-copyright-mark


  •        glyphicon glyphicon-credit-card


  •        glyphicon glyphicon-cutlery


  •        glyphicon glyphicon-dashboard


  •        glyphicon glyphicon-download


  •        glyphicon glyphicon-download-alt


  •        glyphicon glyphicon-earphone


  •        glyphicon glyphicon-edit


  •        glyphicon glyphicon-eject


  •        glyphicon glyphicon-envelope


  •        glyphicon glyphicon-euro


  •        glyphicon glyphicon-exclamation-sign


  •        glyphicon glyphicon-expand


  •        glyphicon glyphicon-export


  •        glyphicon glyphicon-eye-close


  •        glyphicon glyphicon-eye-open


  •        glyphicon glyphicon-facetime-video


  •        glyphicon glyphicon-fast-backward


  •        glyphicon glyphicon-fast-forward


  •        glyphicon glyphicon-file


  •        glyphicon glyphicon-film


  •        glyphicon glyphicon-filter


  •        glyphicon glyphicon-fire


  •        glyphicon glyphicon-flag


  •        glyphicon glyphicon-flash


  •        glyphicon glyphicon-floppy-disk


  •        glyphicon glyphicon-floppy-open


  •        glyphicon glyphicon-floppy-remove


  •        glyphicon glyphicon-floppy-save


  •        glyphicon glyphicon-floppy-saved


  •        glyphicon glyphicon-folder-close


  •        glyphicon glyphicon-folder-open


  •        glyphicon glyphicon-font


  •        glyphicon glyphicon-forward


  •        glyphicon glyphicon-fullscreen


  •        glyphicon glyphicon-gbp


  •        glyphicon glyphicon-gift


  •        glyphicon glyphicon-glass


  •        glyphicon glyphicon-globe


  •        glyphicon glyphicon-hand-down


  •        glyphicon glyphicon-hand-left


  •        glyphicon glyphicon-hand-right


  •        glyphicon glyphicon-hand-up


  •        glyphicon glyphicon-hd-video


  •        glyphicon glyphicon-hdd


  •        glyphicon glyphicon-header


  •        glyphicon glyphicon-headphones


  •        glyphicon glyphicon-heart


  •        glyphicon glyphicon-heart-empty


  •        glyphicon glyphicon-home


  •        glyphicon glyphicon-import


  •        glyphicon glyphicon-inbox


  •        glyphicon glyphicon-indent-left


  •        glyphicon glyphicon-indent-right


  •        glyphicon glyphicon-info-sign


  •        glyphicon glyphicon-italic


  •        glyphicon glyphicon-leaf


  •        glyphicon glyphicon-link


  •        glyphicon glyphicon-list


  •        glyphicon glyphicon-list-alt


  •        glyphicon glyphicon-lock


  •        glyphicon glyphicon-log-in


  •        glyphicon glyphicon-log-out


  •        glyphicon glyphicon-magnet


  •        glyphicon glyphicon-map-marker


  •        glyphicon glyphicon-minus


  •        glyphicon glyphicon-minus-sign


  •        glyphicon glyphicon-move


  •        glyphicon glyphicon-music


  •        glyphicon glyphicon-new-window


  •        glyphicon glyphicon-off


  •        glyphicon glyphicon-ok


  •        glyphicon glyphicon-ok-circle


  •        glyphicon glyphicon-ok-sign


  •        glyphicon glyphicon-open


  •        glyphicon glyphicon-paperclip


  •        glyphicon glyphicon-pause


  •        glyphicon glyphicon-pencil


  •        glyphicon glyphicon-phone


  •        glyphicon glyphicon-phone-alt


  •        glyphicon glyphicon-picture


  •        glyphicon glyphicon-plane


  •        glyphicon glyphicon-play


  •        glyphicon glyphicon-play-circle


  •        glyphicon glyphicon-plus


  •        glyphicon glyphicon-plus-sign


  •        glyphicon glyphicon-print


  •        glyphicon glyphicon-pushpin


  •        glyphicon glyphicon-qrcode


  •        glyphicon glyphicon-question-sign


  •        glyphicon glyphicon-random


  •        glyphicon glyphicon-record


  •        glyphicon glyphicon-refresh


  •        glyphicon glyphicon-registration-mark


  •        glyphicon glyphicon-remove


  •        glyphicon glyphicon-remove-circle


  •        glyphicon glyphicon-remove-sign


  •        glyphicon glyphicon-repeat


  •        glyphicon glyphicon-resize-full


  •        glyphicon glyphicon-resize-horizontal


  •        glyphicon glyphicon-resize-small


  •        glyphicon glyphicon-resize-vertical


  •        glyphicon glyphicon-retweet


  •        glyphicon glyphicon-road


  •        glyphicon glyphicon-save


  •        glyphicon glyphicon-saved


  •        glyphicon glyphicon-screenshot


  •        glyphicon glyphicon-sd-video


  •        glyphicon glyphicon-search


  •        glyphicon glyphicon-send


  •        glyphicon glyphicon-share


  •        glyphicon glyphicon-share-alt


  •        glyphicon glyphicon-shopping-cart


  •        glyphicon glyphicon-signal


  •        glyphicon glyphicon-sort


  •        glyphicon glyphicon-sort-by-alphabet


  •        glyphicon glyphicon-sort-by-alphabet-alt


  •        glyphicon glyphicon-sort-by-attributes


  •        glyphicon glyphicon-sort-by-attributes-alt


  •        glyphicon glyphicon-sort-by-order


  •        glyphicon glyphicon-sort-by-order-alt


  •        glyphicon glyphicon-sound-5-1


  •        glyphicon glyphicon-sound-6-1


  •        glyphicon glyphicon-sound-7-1


  •        glyphicon glyphicon-sound-dolby


  •        glyphicon glyphicon-sound-stereo


  •        glyphicon glyphicon-star


  •        glyphicon glyphicon-star-empty


  •        glyphicon glyphicon-stats


  •        glyphicon glyphicon-step-backward


  •        glyphicon glyphicon-step-forward


  •        glyphicon glyphicon-stop


  •        glyphicon glyphicon-subtitles


  •        glyphicon glyphicon-tag


  •        glyphicon glyphicon-tags


  •        glyphicon glyphicon-tasks


  •        glyphicon glyphicon-text-height


  •        glyphicon glyphicon-text-width


  •        glyphicon glyphicon-th


  •        glyphicon glyphicon-th-large


  •        glyphicon glyphicon-th-list


  •        glyphicon glyphicon-thumbs-down


  •        glyphicon glyphicon-thumbs-up


  •        glyphicon glyphicon-time


  •        glyphicon glyphicon-tint


  •        glyphicon glyphicon-tower


  •        glyphicon glyphicon-transfer


  •        glyphicon glyphicon-trash


  •        glyphicon glyphicon-tree-conifer


  •        glyphicon glyphicon-tree-deciduous


  •        glyphicon glyphicon-unchecked


  •        glyphicon glyphicon-upload


  •        glyphicon glyphicon-usd


  •        glyphicon glyphicon-user


  •        glyphicon glyphicon-volume-down


  •        glyphicon glyphicon-volume-off


  •        glyphicon glyphicon-volume-up


  •        glyphicon glyphicon-warning-sign


  •        glyphicon glyphicon-wrench


  •        glyphicon glyphicon-zoom-in


  •        glyphicon glyphicon-zoom-out

如何使用

出于性能的考虑,所有图标都需要基类和单独的图标类。把下面的代码放在任何地方都能使用。为了留下正确的内补(padding),一定要在图标和文本之间加上一个空格。

图标 class 不能和其它元素联合使用,因为这些图标被设计为独立的元素、独立使用。

<span class="glyphicon glyphicon-search"></span>

案例

把它们放在按钮,工具栏的按钮组中,导航或输入栏的前面都可以。


5ED93752-2F87-45D2-845B-FC7D3681804E.png

群贤毕至

访客