Created
September 26, 2013 23:38
-
-
Save andyj/6722140 to your computer and use it in GitHub Desktop.
If you use Bootswatch files from the bootstrap CDN then to get the Glyphicons working you need to include glphicons css file @ http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <html> | |
| <head> | |
| <link href="//netdna.bootstrapcdn.com/bootswatch/3.0.0/flatly/bootstrap.min.css" rel="stylesheet"> | |
| <link href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css" rel="stylesheet"> | |
| </head> | |
| <body> | |
| <span class="alert alert-danger">Glyphicon example</span> | |
| <hr> | |
| <div class="the-icons"> | |
| <span class="glyphicon glyphicon-glass"></span> | |
| <span class="glyphicon glyphicon-music"></span> | |
| <span class="glyphicon glyphicon-search"></span> | |
| <span class="glyphicon glyphicon-envelope"></span> | |
| <span class="glyphicon glyphicon-heart"></span> | |
| <span class="glyphicon glyphicon-star"></span> | |
| <span class="glyphicon glyphicon-star-empty"></span> | |
| <span class="glyphicon glyphicon-user"></span> | |
| <span class="glyphicon glyphicon-film"></span> | |
| <span class="glyphicon glyphicon-th-large"></span> | |
| <span class="glyphicon glyphicon-th"></span> | |
| <span class="glyphicon glyphicon-th-list"></span> | |
| <span class="glyphicon glyphicon-ok"></span> | |
| <span class="glyphicon glyphicon-remove"></span> | |
| <span class="glyphicon glyphicon-zoom-in"></span> | |
| <span class="glyphicon glyphicon-zoom-out"></span> | |
| <span class="glyphicon glyphicon-off"></span> | |
| <span class="glyphicon glyphicon-signal"></span> | |
| <span class="glyphicon glyphicon-cog"></span> | |
| <span class="glyphicon glyphicon-trash"></span> | |
| <span class="glyphicon glyphicon-home"></span> | |
| <span class="glyphicon glyphicon-file"></span> | |
| <span class="glyphicon glyphicon-time"></span> | |
| <span class="glyphicon glyphicon-road"></span> | |
| <span class="glyphicon glyphicon-download-alt"></span> | |
| <span class="glyphicon glyphicon-download"></span> | |
| <span class="glyphicon glyphicon-upload"></span> | |
| <span class="glyphicon glyphicon-inbox"></span> | |
| <span class="glyphicon glyphicon-play-circle"></span> | |
| <span class="glyphicon glyphicon-repeat"></span> | |
| <span class="glyphicon glyphicon-refresh"></span> | |
| <span class="glyphicon glyphicon-list-alt"></span> | |
| <span class="glyphicon glyphicon-lock"></span> | |
| <span class="glyphicon glyphicon-flag"></span> | |
| <span class="glyphicon glyphicon-headphones"></span> | |
| <span class="glyphicon glyphicon-volume-off"></span> | |
| <span class="glyphicon glyphicon-volume-down"></span> | |
| <span class="glyphicon glyphicon-volume-up"></span> | |
| <span class="glyphicon glyphicon-qrcode"></span> | |
| <span class="glyphicon glyphicon-barcode"></span> | |
| <span class="glyphicon glyphicon-tag"></span> | |
| <span class="glyphicon glyphicon-tags"></span> | |
| <span class="glyphicon glyphicon-book"></span> | |
| <span class="glyphicon glyphicon-bookmark"></span> | |
| <span class="glyphicon glyphicon-print"></span> | |
| <span class="glyphicon glyphicon-camera"></span> | |
| <span class="glyphicon glyphicon-font"></span> | |
| <span class="glyphicon glyphicon-bold"></span> | |
| <span class="glyphicon glyphicon-italic"></span> | |
| <span class="glyphicon glyphicon-text-height"></span> | |
| <span class="glyphicon glyphicon-text-width"></span> | |
| <span class="glyphicon glyphicon-align-left"></span> | |
| <span class="glyphicon glyphicon-align-center"></span> | |
| <span class="glyphicon glyphicon-align-right"></span> | |
| <span class="glyphicon glyphicon-align-justify"></span> | |
| <span class="glyphicon glyphicon-list"></span> | |
| <span class="glyphicon glyphicon-indent-left"></span> | |
| <span class="glyphicon glyphicon-indent-right"></span> | |
| <span class="glyphicon glyphicon-facetime-video"></span> | |
| <span class="glyphicon glyphicon-picture"></span> | |
| <span class="glyphicon glyphicon-pencil"></span> | |
| <span class="glyphicon glyphicon-map-marker"></span> | |
| <span class="glyphicon glyphicon-adjust"></span> | |
| <span class="glyphicon glyphicon-tint"></span> | |
| <span class="glyphicon glyphicon-edit"></span> | |
| <span class="glyphicon glyphicon-share"></span> | |
| <span class="glyphicon glyphicon-check"></span> | |
| <span class="glyphicon glyphicon-move"></span> | |
| <span class="glyphicon glyphicon-step-backward"></span> | |
| <span class="glyphicon glyphicon-fast-backward"></span> | |
| <span class="glyphicon glyphicon-backward"></span> | |
| <span class="glyphicon glyphicon-play"></span> | |
| <span class="glyphicon glyphicon-pause"></span> | |
| <span class="glyphicon glyphicon-stop"></span> | |
| <span class="glyphicon glyphicon-forward"></span> | |
| <span class="glyphicon glyphicon-fast-forward"></span> | |
| <span class="glyphicon glyphicon-step-forward"></span> | |
| <span class="glyphicon glyphicon-eject"></span> | |
| <span class="glyphicon glyphicon-chevron-left"></span> | |
| <span class="glyphicon glyphicon-chevron-right"></span> | |
| <span class="glyphicon glyphicon-plus-sign"></span> | |
| <span class="glyphicon glyphicon-minus-sign"></span> | |
| <span class="glyphicon glyphicon-remove-sign"></span> | |
| <span class="glyphicon glyphicon-ok-sign"></span> | |
| <span class="glyphicon glyphicon-question-sign"></span> | |
| <span class="glyphicon glyphicon-info-sign"></span> | |
| <span class="glyphicon glyphicon-screenshot"></span> | |
| <span class="glyphicon glyphicon-remove-circle"></span> | |
| <span class="glyphicon glyphicon-ok-circle"></span> | |
| <span class="glyphicon glyphicon-ban-circle"></span> | |
| <span class="glyphicon glyphicon-arrow-left"></span> | |
| <span class="glyphicon glyphicon-arrow-right"></span> | |
| <span class="glyphicon glyphicon-arrow-up"></span> | |
| <span class="glyphicon glyphicon-arrow-down"></span> | |
| <span class="glyphicon glyphicon-share-alt"></span> | |
| <span class="glyphicon glyphicon-resize-full"></span> | |
| <span class="glyphicon glyphicon-resize-small"></span> | |
| <span class="glyphicon glyphicon-plus"></span> | |
| <span class="glyphicon glyphicon-minus"></span> | |
| <span class="glyphicon glyphicon-asterisk"></span> | |
| <span class="glyphicon glyphicon-exclamation-sign"></span> | |
| <span class="glyphicon glyphicon-gift"></span> | |
| <span class="glyphicon glyphicon-leaf"></span> | |
| <span class="glyphicon glyphicon-fire"></span> | |
| <span class="glyphicon glyphicon-eye-open"></span> | |
| <span class="glyphicon glyphicon-eye-close"></span> | |
| <span class="glyphicon glyphicon-warning-sign"></span> | |
| <span class="glyphicon glyphicon-plane"></span> | |
| <span class="glyphicon glyphicon-calendar"></span> | |
| <span class="glyphicon glyphicon-random"></span> | |
| <span class="glyphicon glyphicon-comment"></span> | |
| <span class="glyphicon glyphicon-magnet"></span> | |
| <span class="glyphicon glyphicon-chevron-up"></span> | |
| <span class="glyphicon glyphicon-chevron-down"></span> | |
| <span class="glyphicon glyphicon-retweet"></span> | |
| <span class="glyphicon glyphicon-shopping-cart"></span> | |
| <span class="glyphicon glyphicon-folder-close"></span> | |
| <span class="glyphicon glyphicon-folder-open"></span> | |
| <span class="glyphicon glyphicon-resize-vertical"></span> | |
| <span class="glyphicon glyphicon-resize-horizontal"></span> | |
| <span class="glyphicon glyphicon-hdd"></span> | |
| <span class="glyphicon glyphicon-bullhorn"></span> | |
| <span class="glyphicon glyphicon-bell"></span> | |
| <span class="glyphicon glyphicon-certificate"></span> | |
| <span class="glyphicon glyphicon-thumbs-up"></span> | |
| <span class="glyphicon glyphicon-thumbs-down"></span> | |
| <span class="glyphicon glyphicon-hand-right"></span> | |
| <span class="glyphicon glyphicon-hand-left"></span> | |
| <span class="glyphicon glyphicon-hand-up"></span> | |
| <span class="glyphicon glyphicon-hand-down"></span> | |
| <span class="glyphicon glyphicon-circle-arrow-right"></span> | |
| <span class="glyphicon glyphicon-circle-arrow-left"></span> | |
| <span class="glyphicon glyphicon-circle-arrow-up"></span> | |
| <span class="glyphicon glyphicon-circle-arrow-down"></span> | |
| <span class="glyphicon glyphicon-globe"></span> | |
| <span class="glyphicon glyphicon-wrench"></span> | |
| <span class="glyphicon glyphicon-tasks"></span> | |
| <span class="glyphicon glyphicon-filter"></span> | |
| <span class="glyphicon glyphicon-briefcase"></span> | |
| <span class="glyphicon glyphicon-fullscreen"></span> | |
| <span class="glyphicon glyphicon-dashboard"></span> | |
| <span class="glyphicon glyphicon-paperclip"></span> | |
| <span class="glyphicon glyphicon-heart-empty"></span> | |
| <span class="glyphicon glyphicon-link"></span> | |
| <span class="glyphicon glyphicon-phone"></span> | |
| <span class="glyphicon glyphicon-pushpin"></span> | |
| <span class="glyphicon glyphicon-euro"></span> | |
| <span class="glyphicon glyphicon-usd"></span> | |
| <span class="glyphicon glyphicon-gbp"></span> | |
| <span class="glyphicon glyphicon-sort"></span> | |
| <span class="glyphicon glyphicon-sort-by-alphabet"></span> | |
| <span class="glyphicon glyphicon-sort-by-alphabet-alt"></span> | |
| <span class="glyphicon glyphicon-sort-by-order"></span> | |
| <span class="glyphicon glyphicon-sort-by-order-alt"></span> | |
| <span class="glyphicon glyphicon-sort-by-attributes"></span> | |
| <span class="glyphicon glyphicon-sort-by-attributes-alt"></span> | |
| <span class="glyphicon glyphicon-unchecked"></span> | |
| <span class="glyphicon glyphicon-expand"></span> | |
| <span class="glyphicon glyphicon-collapse"></span> | |
| <span class="glyphicon glyphicon-collapse-top"></span> | |
| </div> | |
| <body> | |
| </html> |
Factually those lines are just to inherit the properties to be used while using Glyphicons. @alcalyn.
And yeah it is lkind of easy to use
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Thanks <3