diff options
| author | Mark Otto <[email protected]> | 2013-10-20 22:55:45 -0700 |
|---|---|---|
| committer | Mark Otto <[email protected]> | 2013-10-20 22:55:45 -0700 |
| commit | 2eec3f919e7bd7ee847c2631ae9c53515cac1c8f (patch) | |
| tree | b9dd9c6b61fcb72aafe47dd85beac8cfb9da4fe2 /components.html | |
| parent | ab3d0a27b3d93eebff3852728f94ddc4fcb35199 (diff) | |
| parent | 6585c5898a47deb2df5f7db4f9ef3fe8fa1e5a4a (diff) | |
| download | bootstrap-2eec3f919e7bd7ee847c2631ae9c53515cac1c8f.tar.xz bootstrap-2eec3f919e7bd7ee847c2631ae9c53515cac1c8f.zip | |
Merge branch 'master' into pr/10656
Conflicts:
dist/css/bootstrap.min.css
Diffstat (limited to 'components.html')
| -rw-r--r-- | components.html | 1107 |
1 files changed, 868 insertions, 239 deletions
diff --git a/components.html b/components.html index 81f0ae8d2..dbe981c2a 100644 --- a/components.html +++ b/components.html @@ -17,206 +17,806 @@ base_url: "../" <h2 id="glyphicons-glyphs">Available glyphs</h2> <p>Includes 200 glyphs in font format from the Glyphicon Halflings set. <a href="http://glyphicons.com/">Glyphicons</a> Halflings are normally not available for free, but their creator has made them available for Bootstrap free of cost. As a thank you, we only ask that you to include a link back to <a href="http://glyphicons.com/">Glyphicons</a> whenever possible.</p> <ul class="bs-glyphicons"> - <li><span class="glyphicon glyphicon-adjust"></span> .glyphicon .glyphicon-adjust</li> - <li><span class="glyphicon glyphicon-align-center"></span> .glyphicon .glyphicon-align-center</li> - <li><span class="glyphicon glyphicon-align-justify"></span> .glyphicon .glyphicon-align-justify</li> - <li><span class="glyphicon glyphicon-align-left"></span> .glyphicon .glyphicon-align-left</li> - <li><span class="glyphicon glyphicon-align-right"></span> .glyphicon .glyphicon-align-right</li> - <li><span class="glyphicon glyphicon-arrow-down"></span> .glyphicon .glyphicon-arrow-down</li> - <li><span class="glyphicon glyphicon-arrow-left"></span> .glyphicon .glyphicon-arrow-left</li> - <li><span class="glyphicon glyphicon-arrow-right"></span> .glyphicon .glyphicon-arrow-right</li> - <li><span class="glyphicon glyphicon-arrow-up"></span> .glyphicon .glyphicon-arrow-up</li> - <li><span class="glyphicon glyphicon-asterisk"></span> .glyphicon .glyphicon-asterisk</li> - <li><span class="glyphicon glyphicon-backward"></span> .glyphicon .glyphicon-backward</li> - <li><span class="glyphicon glyphicon-ban-circle"></span> .glyphicon .glyphicon-ban-circle</li> - <li><span class="glyphicon glyphicon-barcode"></span> .glyphicon .glyphicon-barcode</li> - <li><span class="glyphicon glyphicon-bell"></span> .glyphicon .glyphicon-bell</li> - <li><span class="glyphicon glyphicon-bold"></span> .glyphicon .glyphicon-bold</li> - <li><span class="glyphicon glyphicon-book"></span> .glyphicon .glyphicon-book</li> - <li><span class="glyphicon glyphicon-bookmark"></span> .glyphicon .glyphicon-bookmark</li> - <li><span class="glyphicon glyphicon-briefcase"></span> .glyphicon .glyphicon-briefcase</li> - <li><span class="glyphicon glyphicon-bullhorn"></span> .glyphicon .glyphicon-bullhorn</li> - <li><span class="glyphicon glyphicon-calendar"></span> .glyphicon .glyphicon-calendar</li> - <li><span class="glyphicon glyphicon-camera"></span> .glyphicon .glyphicon-camera</li> - <li><span class="glyphicon glyphicon-certificate"></span> .glyphicon .glyphicon-certificate</li> - <li><span class="glyphicon glyphicon-check"></span> .glyphicon .glyphicon-check</li> - <li><span class="glyphicon glyphicon-chevron-down"></span> .glyphicon .glyphicon-chevron-down</li> - <li><span class="glyphicon glyphicon-chevron-left"></span> .glyphicon .glyphicon-chevron-left</li> - <li><span class="glyphicon glyphicon-chevron-right"></span> .glyphicon .glyphicon-chevron-right</li> - <li><span class="glyphicon glyphicon-chevron-up"></span> .glyphicon .glyphicon-chevron-up</li> - <li><span class="glyphicon glyphicon-circle-arrow-down"></span> .glyphicon .glyphicon-circle-arrow-down</li> - <li><span class="glyphicon glyphicon-circle-arrow-left"></span> .glyphicon .glyphicon-circle-arrow-left</li> - <li><span class="glyphicon glyphicon-circle-arrow-right"></span> .glyphicon .glyphicon-circle-arrow-right</li> - <li><span class="glyphicon glyphicon-circle-arrow-up"></span> .glyphicon .glyphicon-circle-arrow-up</li> - <li><span class="glyphicon glyphicon-cloud"></span> .glyphicon .glyphicon-cloud</li> - <li><span class="glyphicon glyphicon-cloud-download"></span> .glyphicon .glyphicon-cloud-download</li> - <li><span class="glyphicon glyphicon-cloud-upload"></span> .glyphicon .glyphicon-cloud-upload</li> - <li><span class="glyphicon glyphicon-cog"></span> .glyphicon .glyphicon-cog</li> - <li><span class="glyphicon glyphicon-collapse-down"></span> .glyphicon .glyphicon-collapse-down</li> - <li><span class="glyphicon glyphicon-collapse-up"></span> .glyphicon .glyphicon-collapse-up</li> - <li><span class="glyphicon glyphicon-comment"></span> .glyphicon .glyphicon-comment</li> - <li><span class="glyphicon glyphicon-compressed"></span> .glyphicon .glyphicon-compressed</li> - <li><span class="glyphicon glyphicon-copyright-mark"></span> .glyphicon .glyphicon-copyright-mark</li> - <li><span class="glyphicon glyphicon-credit-card"></span> .glyphicon .glyphicon-credit-card</li> - <li><span class="glyphicon glyphicon-cutlery"></span> .glyphicon .glyphicon-cutlery</li> - <li><span class="glyphicon glyphicon-dashboard"></span> .glyphicon .glyphicon-dashboard</li> - <li><span class="glyphicon glyphicon-download"></span> .glyphicon .glyphicon-download</li> - <li><span class="glyphicon glyphicon-download-alt"></span> .glyphicon .glyphicon-download-alt</li> - <li><span class="glyphicon glyphicon-earphone"></span> .glyphicon .glyphicon-earphone</li> - <li><span class="glyphicon glyphicon-edit"></span> .glyphicon .glyphicon-edit</li> - <li><span class="glyphicon glyphicon-eject"></span> .glyphicon .glyphicon-eject</li> - <li><span class="glyphicon glyphicon-envelope"></span> .glyphicon .glyphicon-envelope</li> - <li><span class="glyphicon glyphicon-euro"></span> .glyphicon .glyphicon-euro</li> - <li><span class="glyphicon glyphicon-exclamation-sign"></span> .glyphicon .glyphicon-exclamation-sign</li> - <li><span class="glyphicon glyphicon-expand"></span> .glyphicon .glyphicon-expand</li> - <li><span class="glyphicon glyphicon-export"></span> .glyphicon .glyphicon-export</li> - <li><span class="glyphicon glyphicon-eye-close"></span> .glyphicon .glyphicon-eye-close</li> - <li><span class="glyphicon glyphicon-eye-open"></span> .glyphicon .glyphicon-eye-open</li> - <li><span class="glyphicon glyphicon-facetime-video"></span> .glyphicon .glyphicon-facetime-video</li> - <li><span class="glyphicon glyphicon-fast-backward"></span> .glyphicon .glyphicon-fast-backward</li> - <li><span class="glyphicon glyphicon-fast-forward"></span> .glyphicon .glyphicon-fast-forward</li> - <li><span class="glyphicon glyphicon-file"></span> .glyphicon .glyphicon-file</li> - <li><span class="glyphicon glyphicon-film"></span> .glyphicon .glyphicon-film</li> - <li><span class="glyphicon glyphicon-filter"></span> .glyphicon .glyphicon-filter</li> - <li><span class="glyphicon glyphicon-fire"></span> .glyphicon .glyphicon-fire</li> - <li><span class="glyphicon glyphicon-flag"></span> .glyphicon .glyphicon-flag</li> - <li><span class="glyphicon glyphicon-flash"></span> .glyphicon .glyphicon-flash</li> - <li><span class="glyphicon glyphicon-floppy-disk"></span> .glyphicon .glyphicon-floppy-disk</li> - <li><span class="glyphicon glyphicon-floppy-open"></span> .glyphicon .glyphicon-floppy-open</li> - <li><span class="glyphicon glyphicon-floppy-remove"></span> .glyphicon .glyphicon-floppy-remove</li> - <li><span class="glyphicon glyphicon-floppy-save"></span> .glyphicon .glyphicon-floppy-save</li> - <li><span class="glyphicon glyphicon-floppy-saved"></span> .glyphicon .glyphicon-floppy-saved</li> - <li><span class="glyphicon glyphicon-folder-close"></span> .glyphicon .glyphicon-folder-close</li> - <li><span class="glyphicon glyphicon-folder-open"></span> .glyphicon .glyphicon-folder-open</li> - <li><span class="glyphicon glyphicon-font"></span> .glyphicon .glyphicon-font</li> - <li><span class="glyphicon glyphicon-forward"></span> .glyphicon .glyphicon-forward</li> - <li><span class="glyphicon glyphicon-fullscreen"></span> .glyphicon .glyphicon-fullscreen</li> - <li><span class="glyphicon glyphicon-gbp"></span> .glyphicon .glyphicon-gbp</li> - <li><span class="glyphicon glyphicon-gift"></span> .glyphicon .glyphicon-gift</li> - <li><span class="glyphicon glyphicon-glass"></span> .glyphicon .glyphicon-glass</li> - <li><span class="glyphicon glyphicon-globe"></span> .glyphicon .glyphicon-globe</li> - <li><span class="glyphicon glyphicon-hand-down"></span> .glyphicon .glyphicon-hand-down</li> - <li><span class="glyphicon glyphicon-hand-left"></span> .glyphicon .glyphicon-hand-left</li> - <li><span class="glyphicon glyphicon-hand-right"></span> .glyphicon .glyphicon-hand-right</li> - <li><span class="glyphicon glyphicon-hand-up"></span> .glyphicon .glyphicon-hand-up</li> - <li><span class="glyphicon glyphicon-hd-video"></span> .glyphicon .glyphicon-hd-video</li> - <li><span class="glyphicon glyphicon-hdd"></span> .glyphicon .glyphicon-hdd</li> - <li><span class="glyphicon glyphicon-header"></span> .glyphicon .glyphicon-header</li> - <li><span class="glyphicon glyphicon-headphones"></span> .glyphicon .glyphicon-headphones</li> - <li><span class="glyphicon glyphicon-heart"></span> .glyphicon .glyphicon-heart</li> - <li><span class="glyphicon glyphicon-heart-empty"></span> .glyphicon .glyphicon-heart-empty</li> - <li><span class="glyphicon glyphicon-home"></span> .glyphicon .glyphicon-home</li> - <li><span class="glyphicon glyphicon-import"></span> .glyphicon .glyphicon-import</li> - <li><span class="glyphicon glyphicon-inbox"></span> .glyphicon .glyphicon-inbox</li> - <li><span class="glyphicon glyphicon-indent-left"></span> .glyphicon .glyphicon-indent-left</li> - <li><span class="glyphicon glyphicon-indent-right"></span> .glyphicon .glyphicon-indent-right</li> - <li><span class="glyphicon glyphicon-info-sign"></span> .glyphicon .glyphicon-info-sign</li> - <li><span class="glyphicon glyphicon-italic"></span> .glyphicon .glyphicon-italic</li> - <li><span class="glyphicon glyphicon-leaf"></span> .glyphicon .glyphicon-leaf</li> - <li><span class="glyphicon glyphicon-link"></span> .glyphicon .glyphicon-link</li> - <li><span class="glyphicon glyphicon-list"></span> .glyphicon .glyphicon-list</li> - <li><span class="glyphicon glyphicon-list-alt"></span> .glyphicon .glyphicon-list-alt</li> - <li><span class="glyphicon glyphicon-lock"></span> .glyphicon .glyphicon-lock</li> - <li><span class="glyphicon glyphicon-log-in"></span> .glyphicon .glyphicon-log-in</li> - <li><span class="glyphicon glyphicon-log-out"></span> .glyphicon .glyphicon-log-out</li> - <li><span class="glyphicon glyphicon-magnet"></span> .glyphicon .glyphicon-magnet</li> - <li><span class="glyphicon glyphicon-map-marker"></span> .glyphicon .glyphicon-map-marker</li> - <li><span class="glyphicon glyphicon-minus"></span> .glyphicon .glyphicon-minus</li> - <li><span class="glyphicon glyphicon-minus-sign"></span> .glyphicon .glyphicon-minus-sign</li> - <li><span class="glyphicon glyphicon-move"></span> .glyphicon .glyphicon-move</li> - <li><span class="glyphicon glyphicon-music"></span> .glyphicon .glyphicon-music</li> - <li><span class="glyphicon glyphicon-new-window"></span> .glyphicon .glyphicon-new-window</li> - <li><span class="glyphicon glyphicon-off"></span> .glyphicon .glyphicon-off</li> - <li><span class="glyphicon glyphicon-ok"></span> .glyphicon .glyphicon-ok</li> - <li><span class="glyphicon glyphicon-ok-circle"></span> .glyphicon .glyphicon-ok-circle</li> - <li><span class="glyphicon glyphicon-ok-sign"></span> .glyphicon .glyphicon-ok-sign</li> - <li><span class="glyphicon glyphicon-open"></span> .glyphicon .glyphicon-open</li> - <li><span class="glyphicon glyphicon-paperclip"></span> .glyphicon .glyphicon-paperclip</li> - <li><span class="glyphicon glyphicon-pause"></span> .glyphicon .glyphicon-pause</li> - <li><span class="glyphicon glyphicon-pencil"></span> .glyphicon .glyphicon-pencil</li> - <li><span class="glyphicon glyphicon-phone"></span> .glyphicon .glyphicon-phone</li> - <li><span class="glyphicon glyphicon-phone-alt"></span> .glyphicon .glyphicon-phone-alt</li> - <li><span class="glyphicon glyphicon-picture"></span> .glyphicon .glyphicon-picture</li> - <li><span class="glyphicon glyphicon-plane"></span> .glyphicon .glyphicon-plane</li> - <li><span class="glyphicon glyphicon-play"></span> .glyphicon .glyphicon-play</li> - <li><span class="glyphicon glyphicon-play-circle"></span> .glyphicon .glyphicon-play-circle</li> - <li><span class="glyphicon glyphicon-plus"></span> .glyphicon .glyphicon-plus</li> - <li><span class="glyphicon glyphicon-plus-sign"></span> .glyphicon .glyphicon-plus-sign</li> - <li><span class="glyphicon glyphicon-print"></span> .glyphicon .glyphicon-print</li> - <li><span class="glyphicon glyphicon-pushpin"></span> .glyphicon .glyphicon-pushpin</li> - <li><span class="glyphicon glyphicon-qrcode"></span> .glyphicon .glyphicon-qrcode</li> - <li><span class="glyphicon glyphicon-question-sign"></span> .glyphicon .glyphicon-question-sign</li> - <li><span class="glyphicon glyphicon-random"></span> .glyphicon .glyphicon-random</li> - <li><span class="glyphicon glyphicon-record"></span> .glyphicon .glyphicon-record</li> - <li><span class="glyphicon glyphicon-refresh"></span> .glyphicon .glyphicon-refresh</li> - <li><span class="glyphicon glyphicon-registration-mark"></span> .glyphicon .glyphicon-registration-mark</li> - <li><span class="glyphicon glyphicon-remove"></span> .glyphicon .glyphicon-remove</li> - <li><span class="glyphicon glyphicon-remove-circle"></span> .glyphicon .glyphicon-remove-circle</li> - <li><span class="glyphicon glyphicon-remove-sign"></span> .glyphicon .glyphicon-remove-sign</li> - <li><span class="glyphicon glyphicon-repeat"></span> .glyphicon .glyphicon-repeat</li> - <li><span class="glyphicon glyphicon-resize-full"></span> .glyphicon .glyphicon-resize-full</li> - <li><span class="glyphicon glyphicon-resize-horizontal"></span> .glyphicon .glyphicon-resize-horizontal</li> - <li><span class="glyphicon glyphicon-resize-small"></span> .glyphicon .glyphicon-resize-small</li> - <li><span class="glyphicon glyphicon-resize-vertical"></span> .glyphicon .glyphicon-resize-vertical</li> - <li><span class="glyphicon glyphicon-retweet"></span> .glyphicon .glyphicon-retweet</li> - <li><span class="glyphicon glyphicon-road"></span> .glyphicon .glyphicon-road</li> - <li><span class="glyphicon glyphicon-save"></span> .glyphicon .glyphicon-save</li> - <li><span class="glyphicon glyphicon-saved"></span> .glyphicon .glyphicon-saved</li> - <li><span class="glyphicon glyphicon-screenshot"></span> .glyphicon .glyphicon-screenshot</li> - <li><span class="glyphicon glyphicon-sd-video"></span> .glyphicon .glyphicon-sd-video</li> - <li><span class="glyphicon glyphicon-search"></span> .glyphicon .glyphicon-search</li> - <li><span class="glyphicon glyphicon-send"></span> .glyphicon .glyphicon-send</li> - <li><span class="glyphicon glyphicon-share"></span> .glyphicon .glyphicon-share</li> - <li><span class="glyphicon glyphicon-share-alt"></span> .glyphicon .glyphicon-share-alt</li> - <li><span class="glyphicon glyphicon-shopping-cart"></span> .glyphicon .glyphicon-shopping-cart</li> - <li><span class="glyphicon glyphicon-signal"></span> .glyphicon .glyphicon-signal</li> - <li><span class="glyphicon glyphicon-sort"></span> .glyphicon .glyphicon-sort</li> - <li><span class="glyphicon glyphicon-sort-by-alphabet"></span> .glyphicon .glyphicon-sort-by-alphabet</li> - <li><span class="glyphicon glyphicon-sort-by-alphabet-alt"></span> .glyphicon .glyphicon-sort-by-alphabet-alt</li> - <li><span class="glyphicon glyphicon-sort-by-attributes"></span> .glyphicon .glyphicon-sort-by-attributes</li> - <li><span class="glyphicon glyphicon-sort-by-attributes-alt"></span> .glyphicon .glyphicon-sort-by-attributes-alt</li> - <li><span class="glyphicon glyphicon-sort-by-order"></span> .glyphicon .glyphicon-sort-by-order</li> - <li><span class="glyphicon glyphicon-sort-by-order-alt"></span> .glyphicon .glyphicon-sort-by-order-alt</li> - <li><span class="glyphicon glyphicon-sound-5-1"></span> .glyphicon .glyphicon-sound-5-1</li> - <li><span class="glyphicon glyphicon-sound-6-1"></span> .glyphicon .glyphicon-sound-6-1</li> - <li><span class="glyphicon glyphicon-sound-7-1"></span> .glyphicon .glyphicon-sound-7-1</li> - <li><span class="glyphicon glyphicon-sound-dolby"></span> .glyphicon .glyphicon-sound-dolby</li> - <li><span class="glyphicon glyphicon-sound-stereo"></span> .glyphicon .glyphicon-sound-stereo</li> - <li><span class="glyphicon glyphicon-star"></span> .glyphicon .glyphicon-star</li> - <li><span class="glyphicon glyphicon-star-empty"></span> .glyphicon .glyphicon-star-empty</li> - <li><span class="glyphicon glyphicon-stats"></span> .glyphicon .glyphicon-stats</li> - <li><span class="glyphicon glyphicon-step-backward"></span> .glyphicon .glyphicon-step-backward</li> - <li><span class="glyphicon glyphicon-step-forward"></span> .glyphicon .glyphicon-step-forward</li> - <li><span class="glyphicon glyphicon-stop"></span> .glyphicon .glyphicon-stop</li> - <li><span class="glyphicon glyphicon-subtitles"></span> .glyphicon .glyphicon-subtitles</li> - <li><span class="glyphicon glyphicon-tag"></span> .glyphicon .glyphicon-tag</li> - <li><span class="glyphicon glyphicon-tags"></span> .glyphicon .glyphicon-tags</li> - <li><span class="glyphicon glyphicon-tasks"></span> .glyphicon .glyphicon-tasks</li> - <li><span class="glyphicon glyphicon-text-height"></span> .glyphicon .glyphicon-text-height</li> - <li><span class="glyphicon glyphicon-text-width"></span> .glyphicon .glyphicon-text-width</li> - <li><span class="glyphicon glyphicon-th"></span> .glyphicon .glyphicon-th</li> - <li><span class="glyphicon glyphicon-th-large"></span> .glyphicon .glyphicon-th-large</li> - <li><span class="glyphicon glyphicon-th-list"></span> .glyphicon .glyphicon-th-list</li> - <li><span class="glyphicon glyphicon-thumbs-down"></span> .glyphicon .glyphicon-thumbs-down</li> - <li><span class="glyphicon glyphicon-thumbs-up"></span> .glyphicon .glyphicon-thumbs-up</li> - <li><span class="glyphicon glyphicon-time"></span> .glyphicon .glyphicon-time</li> - <li><span class="glyphicon glyphicon-tint"></span> .glyphicon .glyphicon-tint</li> - <li><span class="glyphicon glyphicon-tower"></span> .glyphicon .glyphicon-tower</li> - <li><span class="glyphicon glyphicon-transfer"></span> .glyphicon .glyphicon-transfer</li> - <li><span class="glyphicon glyphicon-trash"></span> .glyphicon .glyphicon-trash</li> - <li><span class="glyphicon glyphicon-tree-conifer"></span> .glyphicon .glyphicon-tree-conifer</li> - <li><span class="glyphicon glyphicon-tree-deciduous"></span> .glyphicon .glyphicon-tree-deciduous</li> - <li><span class="glyphicon glyphicon-unchecked"></span> .glyphicon .glyphicon-unchecked</li> - <li><span class="glyphicon glyphicon-upload"></span> .glyphicon .glyphicon-upload</li> - <li><span class="glyphicon glyphicon-usd"></span> .glyphicon .glyphicon-usd</li> - <li><span class="glyphicon glyphicon-user"></span> .glyphicon .glyphicon-user</li> - <li><span class="glyphicon glyphicon-volume-down"></span> .glyphicon .glyphicon-volume-down</li> - <li><span class="glyphicon glyphicon-volume-off"></span> .glyphicon .glyphicon-volume-off</li> - <li><span class="glyphicon glyphicon-volume-up"></span> .glyphicon .glyphicon-volume-up</li> - <li><span class="glyphicon glyphicon-warning-sign"></span> .glyphicon .glyphicon-warning-sign</li> - <li><span class="glyphicon glyphicon-wrench"></span> .glyphicon .glyphicon-wrench</li> - <li><span class="glyphicon glyphicon-zoom-in"></span> .glyphicon .glyphicon-zoom-in</li> - <li><span class="glyphicon glyphicon-zoom-out"></span> .glyphicon .glyphicon-zoom-out</li> + <li> + <span class="glyphicon glyphicon-adjust"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-adjust</span> + </li> + <li> + <span class="glyphicon glyphicon-align-center"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-align-center</span> + </li> + <li> + <span class="glyphicon glyphicon-align-justify"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-align-justify</span> + </li> + <li> + <span class="glyphicon glyphicon-align-left"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-align-left</span> + </li> + <li> + <span class="glyphicon glyphicon-align-right"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-align-right</span> + </li> + <li> + <span class="glyphicon glyphicon-arrow-down"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-arrow-down</span> + </li> + <li> + <span class="glyphicon glyphicon-arrow-left"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-arrow-left</span> + </li> + <li> + <span class="glyphicon glyphicon-arrow-right"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-arrow-right</span> + </li> + <li> + <span class="glyphicon glyphicon-arrow-up"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-arrow-up</span> + </li> + <li> + <span class="glyphicon glyphicon-asterisk"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-asterisk</span> + </li> + <li> + <span class="glyphicon glyphicon-backward"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-backward</span> + </li> + <li> + <span class="glyphicon glyphicon-ban-circle"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-ban-circle</span> + </li> + <li> + <span class="glyphicon glyphicon-barcode"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-barcode</span> + </li> + <li> + <span class="glyphicon glyphicon-bell"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-bell</span> + </li> + <li> + <span class="glyphicon glyphicon-bold"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-bold</span> + </li> + <li> + <span class="glyphicon glyphicon-book"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-book</span> + </li> + <li> + <span class="glyphicon glyphicon-bookmark"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-bookmark</span> + </li> + <li> + <span class="glyphicon glyphicon-briefcase"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-briefcase</span> + </li> + <li> + <span class="glyphicon glyphicon-bullhorn"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-bullhorn</span> + </li> + <li> + <span class="glyphicon glyphicon-calendar"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-calendar</span> + </li> + <li> + <span class="glyphicon glyphicon-camera"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-camera</span> + </li> + <li> + <span class="glyphicon glyphicon-certificate"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-certificate</span> + </li> + <li> + <span class="glyphicon glyphicon-check"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-check</span> + </li> + <li> + <span class="glyphicon glyphicon-chevron-down"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-chevron-down</span> + </li> + <li> + <span class="glyphicon glyphicon-chevron-left"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-chevron-left</span> + </li> + <li> + <span class="glyphicon glyphicon-chevron-right"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-chevron-right</span> + </li> + <li> + <span class="glyphicon glyphicon-chevron-up"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-chevron-up</span> + </li> + <li> + <span class="glyphicon glyphicon-circle-arrow-down"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-circle-arrow-down</span> + </li> + <li> + <span class="glyphicon glyphicon-circle-arrow-left"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-circle-arrow-left</span> + </li> + <li> + <span class="glyphicon glyphicon-circle-arrow-right"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-circle-arrow-right</span> + </li> + <li> + <span class="glyphicon glyphicon-circle-arrow-up"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-circle-arrow-up</span> + </li> + <li> + <span class="glyphicon glyphicon-cloud"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-cloud</span> + </li> + <li> + <span class="glyphicon glyphicon-cloud-download"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-cloud-download</span> + </li> + <li> + <span class="glyphicon glyphicon-cloud-upload"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-cloud-upload</span> + </li> + <li> + <span class="glyphicon glyphicon-cog"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-cog</span> + </li> + <li> + <span class="glyphicon glyphicon-collapse-down"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-collapse-down</span> + </li> + <li> + <span class="glyphicon glyphicon-collapse-up"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-collapse-up</span> + </li> + <li> + <span class="glyphicon glyphicon-comment"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-comment</span> + </li> + <li> + <span class="glyphicon glyphicon-compressed"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-compressed</span> + </li> + <li> + <span class="glyphicon glyphicon-copyright-mark"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-copyright-mark</span> + </li> + <li> + <span class="glyphicon glyphicon-credit-card"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-credit-card</span> + </li> + <li> + <span class="glyphicon glyphicon-cutlery"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-cutlery</span> + </li> + <li> + <span class="glyphicon glyphicon-dashboard"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-dashboard</span> + </li> + <li> + <span class="glyphicon glyphicon-download"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-download</span> + </li> + <li> + <span class="glyphicon glyphicon-download-alt"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-download-alt</span> + </li> + <li> + <span class="glyphicon glyphicon-earphone"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-earphone</span> + </li> + <li> + <span class="glyphicon glyphicon-edit"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-edit</span> + </li> + <li> + <span class="glyphicon glyphicon-eject"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-eject</span> + </li> + <li> + <span class="glyphicon glyphicon-envelope"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-envelope</span> + </li> + <li> + <span class="glyphicon glyphicon-euro"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-euro</span> + </li> + <li> + <span class="glyphicon glyphicon-exclamation-sign"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-exclamation-sign</span> + </li> + <li> + <span class="glyphicon glyphicon-expand"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-expand</span> + </li> + <li> + <span class="glyphicon glyphicon-export"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-export</span> + </li> + <li> + <span class="glyphicon glyphicon-eye-close"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-eye-close</span> + </li> + <li> + <span class="glyphicon glyphicon-eye-open"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-eye-open</span> + </li> + <li> + <span class="glyphicon glyphicon-facetime-video"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-facetime-video</span> + </li> + <li> + <span class="glyphicon glyphicon-fast-backward"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-fast-backward</span> + </li> + <li> + <span class="glyphicon glyphicon-fast-forward"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-fast-forward</span> + </li> + <li> + <span class="glyphicon glyphicon-file"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-file</span> + </li> + <li> + <span class="glyphicon glyphicon-film"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-film</span> + </li> + <li> + <span class="glyphicon glyphicon-filter"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-filter</span> + </li> + <li> + <span class="glyphicon glyphicon-fire"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-fire</span> + </li> + <li> + <span class="glyphicon glyphicon-flag"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-flag</span> + </li> + <li> + <span class="glyphicon glyphicon-flash"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-flash</span> + </li> + <li> + <span class="glyphicon glyphicon-floppy-disk"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-floppy-disk</span> + </li> + <li> + <span class="glyphicon glyphicon-floppy-open"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-floppy-open</span> + </li> + <li> + <span class="glyphicon glyphicon-floppy-remove"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-floppy-remove</span> + </li> + <li> + <span class="glyphicon glyphicon-floppy-save"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-floppy-save</span> + </li> + <li> + <span class="glyphicon glyphicon-floppy-saved"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-floppy-saved</span> + </li> + <li> + <span class="glyphicon glyphicon-folder-close"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-folder-close</span> + </li> + <li> + <span class="glyphicon glyphicon-folder-open"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-folder-open</span> + </li> + <li> + <span class="glyphicon glyphicon-font"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-font</span> + </li> + <li> + <span class="glyphicon glyphicon-forward"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-forward</span> + </li> + <li> + <span class="glyphicon glyphicon-fullscreen"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-fullscreen</span> + </li> + <li> + <span class="glyphicon glyphicon-gbp"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-gbp</span> + </li> + <li> + <span class="glyphicon glyphicon-gift"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-gift</span> + </li> + <li> + <span class="glyphicon glyphicon-glass"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-glass</span> + </li> + <li> + <span class="glyphicon glyphicon-globe"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-globe</span> + </li> + <li> + <span class="glyphicon glyphicon-hand-down"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-hand-down</span> + </li> + <li> + <span class="glyphicon glyphicon-hand-left"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-hand-left</span> + </li> + <li> + <span class="glyphicon glyphicon-hand-right"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-hand-right</span> + </li> + <li> + <span class="glyphicon glyphicon-hand-up"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-hand-up</span> + </li> + <li> + <span class="glyphicon glyphicon-hd-video"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-hd-video</span> + </li> + <li> + <span class="glyphicon glyphicon-hdd"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-hdd</span> + </li> + <li> + <span class="glyphicon glyphicon-header"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-header</span> + </li> + <li> + <span class="glyphicon glyphicon-headphones"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-headphones</span> + </li> + <li> + <span class="glyphicon glyphicon-heart"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-heart</span> + </li> + <li> + <span class="glyphicon glyphicon-heart-empty"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-heart-empty</span> + </li> + <li> + <span class="glyphicon glyphicon-home"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-home</span> + </li> + <li> + <span class="glyphicon glyphicon-import"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-import</span> + </li> + <li> + <span class="glyphicon glyphicon-inbox"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-inbox</span> + </li> + <li> + <span class="glyphicon glyphicon-indent-left"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-indent-left</span> + </li> + <li> + <span class="glyphicon glyphicon-indent-right"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-indent-right</span> + </li> + <li> + <span class="glyphicon glyphicon-info-sign"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-info-sign</span> + </li> + <li> + <span class="glyphicon glyphicon-italic"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-italic</span> + </li> + <li> + <span class="glyphicon glyphicon-leaf"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-leaf</span> + </li> + <li> + <span class="glyphicon glyphicon-link"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-link</span> + </li> + <li> + <span class="glyphicon glyphicon-list"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-list</span> + </li> + <li> + <span class="glyphicon glyphicon-list-alt"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-list-alt</span> + </li> + <li> + <span class="glyphicon glyphicon-lock"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-lock</span> + </li> + <li> + <span class="glyphicon glyphicon-log-in"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-log-in</span> + </li> + <li> + <span class="glyphicon glyphicon-log-out"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-log-out</span> + </li> + <li> + <span class="glyphicon glyphicon-magnet"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-magnet</span> + </li> + <li> + <span class="glyphicon glyphicon-map-marker"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-map-marker</span> + </li> + <li> + <span class="glyphicon glyphicon-minus"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-minus</span> + </li> + <li> + <span class="glyphicon glyphicon-minus-sign"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-minus-sign</span> + </li> + <li> + <span class="glyphicon glyphicon-move"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-move</span> + </li> + <li> + <span class="glyphicon glyphicon-music"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-music</span> + </li> + <li> + <span class="glyphicon glyphicon-new-window"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-new-window</span> + </li> + <li> + <span class="glyphicon glyphicon-off"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-off</span> + </li> + <li> + <span class="glyphicon glyphicon-ok"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-ok</span> + </li> + <li> + <span class="glyphicon glyphicon-ok-circle"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-ok-circle</span> + </li> + <li> + <span class="glyphicon glyphicon-ok-sign"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-ok-sign</span> + </li> + <li> + <span class="glyphicon glyphicon-open"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-open</span> + </li> + <li> + <span class="glyphicon glyphicon-paperclip"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-paperclip</span> + </li> + <li> + <span class="glyphicon glyphicon-pause"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-pause</span> + </li> + <li> + <span class="glyphicon glyphicon-pencil"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-pencil</span> + </li> + <li> + <span class="glyphicon glyphicon-phone"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-phone</span> + </li> + <li> + <span class="glyphicon glyphicon-phone-alt"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-phone-alt</span> + </li> + <li> + <span class="glyphicon glyphicon-picture"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-picture</span> + </li> + <li> + <span class="glyphicon glyphicon-plane"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-plane</span> + </li> + <li> + <span class="glyphicon glyphicon-play"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-play</span> + </li> + <li> + <span class="glyphicon glyphicon-play-circle"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-play-circle</span> + </li> + <li> + <span class="glyphicon glyphicon-plus"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-plus</span> + </li> + <li> + <span class="glyphicon glyphicon-plus-sign"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-plus-sign</span> + </li> + <li> + <span class="glyphicon glyphicon-print"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-print</span> + </li> + <li> + <span class="glyphicon glyphicon-pushpin"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-pushpin</span> + </li> + <li> + <span class="glyphicon glyphicon-qrcode"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-qrcode</span> + </li> + <li> + <span class="glyphicon glyphicon-question-sign"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-question-sign</span> + </li> + <li> + <span class="glyphicon glyphicon-random"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-random</span> + </li> + <li> + <span class="glyphicon glyphicon-record"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-record</span> + </li> + <li> + <span class="glyphicon glyphicon-refresh"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-refresh</span> + </li> + <li> + <span class="glyphicon glyphicon-registration-mark"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-registration-mark</span> + </li> + <li> + <span class="glyphicon glyphicon-remove"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-remove</span> + </li> + <li> + <span class="glyphicon glyphicon-remove-circle"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-remove-circle</span> + </li> + <li> + <span class="glyphicon glyphicon-remove-sign"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-remove-sign</span> + </li> + <li> + <span class="glyphicon glyphicon-repeat"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-repeat</span> + </li> + <li> + <span class="glyphicon glyphicon-resize-full"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-resize-full</span> + </li> + <li> + <span class="glyphicon glyphicon-resize-horizontal"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-resize-horizontal</span> + </li> + <li> + <span class="glyphicon glyphicon-resize-small"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-resize-small</span> + </li> + <li> + <span class="glyphicon glyphicon-resize-vertical"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-resize-vertical</span> + </li> + <li> + <span class="glyphicon glyphicon-retweet"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-retweet</span> + </li> + <li> + <span class="glyphicon glyphicon-road"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-road</span> + </li> + <li> + <span class="glyphicon glyphicon-save"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-save</span> + </li> + <li> + <span class="glyphicon glyphicon-saved"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-saved</span> + </li> + <li> + <span class="glyphicon glyphicon-screenshot"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-screenshot</span> + </li> + <li> + <span class="glyphicon glyphicon-sd-video"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-sd-video</span> + </li> + <li> + <span class="glyphicon glyphicon-search"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-search</span> + </li> + <li> + <span class="glyphicon glyphicon-send"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-send</span> + </li> + <li> + <span class="glyphicon glyphicon-share"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-share</span> + </li> + <li> + <span class="glyphicon glyphicon-share-alt"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-share-alt</span> + </li> + <li> + <span class="glyphicon glyphicon-shopping-cart"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-shopping-cart</span> + </li> + <li> + <span class="glyphicon glyphicon-signal"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-signal</span> + </li> + <li> + <span class="glyphicon glyphicon-sort"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-sort</span> + </li> + <li> + <span class="glyphicon glyphicon-sort-by-alphabet"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-sort-by-alphabet</span> + </li> + <li> + <span class="glyphicon glyphicon-sort-by-alphabet-alt"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-sort-by-alphabet-alt</span> + </li> + <li> + <span class="glyphicon glyphicon-sort-by-attributes"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-sort-by-attributes</span> + </li> + <li> + <span class="glyphicon glyphicon-sort-by-attributes-alt"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-sort-by-attributes-alt</span> + </li> + <li> + <span class="glyphicon glyphicon-sort-by-order"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-sort-by-order</span> + </li> + <li> + <span class="glyphicon glyphicon-sort-by-order-alt"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-sort-by-order-alt</span> + </li> + <li> + <span class="glyphicon glyphicon-sound-5-1"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-sound-5-1</span> + </li> + <li> + <span class="glyphicon glyphicon-sound-6-1"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-sound-6-1</span> + </li> + <li> + <span class="glyphicon glyphicon-sound-7-1"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-sound-7-1</span> + </li> + <li> + <span class="glyphicon glyphicon-sound-dolby"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-sound-dolby</span> + </li> + <li> + <span class="glyphicon glyphicon-sound-stereo"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-sound-stereo</span> + </li> + <li> + <span class="glyphicon glyphicon-star"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-star</span> + </li> + <li> + <span class="glyphicon glyphicon-star-empty"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-star-empty</span> + </li> + <li> + <span class="glyphicon glyphicon-stats"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-stats</span> + </li> + <li> + <span class="glyphicon glyphicon-step-backward"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-step-backward</span> + </li> + <li> + <span class="glyphicon glyphicon-step-forward"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-step-forward</span> + </li> + <li> + <span class="glyphicon glyphicon-stop"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-stop</span> + </li> + <li> + <span class="glyphicon glyphicon-subtitles"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-subtitles</span> + </li> + <li> + <span class="glyphicon glyphicon-tag"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-tag</span> + </li> + <li> + <span class="glyphicon glyphicon-tags"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-tags</span> + </li> + <li> + <span class="glyphicon glyphicon-tasks"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-tasks</span> + </li> + <li> + <span class="glyphicon glyphicon-text-height"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-text-height</span> + </li> + <li> + <span class="glyphicon glyphicon-text-width"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-text-width</span> + </li> + <li> + <span class="glyphicon glyphicon-th"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-th</span> + </li> + <li> + <span class="glyphicon glyphicon-th-large"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-th-large</span> + </li> + <li> + <span class="glyphicon glyphicon-th-list"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-th-list</span> + </li> + <li> + <span class="glyphicon glyphicon-thumbs-down"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-thumbs-down</span> + </li> + <li> + <span class="glyphicon glyphicon-thumbs-up"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-thumbs-up</span> + </li> + <li> + <span class="glyphicon glyphicon-time"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-time</span> + </li> + <li> + <span class="glyphicon glyphicon-tint"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-tint</span> + </li> + <li> + <span class="glyphicon glyphicon-tower"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-tower</span> + </li> + <li> + <span class="glyphicon glyphicon-transfer"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-transfer</span> + </li> + <li> + <span class="glyphicon glyphicon-trash"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-trash</span> + </li> + <li> + <span class="glyphicon glyphicon-tree-conifer"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-tree-conifer</span> + </li> + <li> + <span class="glyphicon glyphicon-tree-deciduous"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-tree-deciduous</span> + </li> + <li> + <span class="glyphicon glyphicon-unchecked"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-unchecked</span> + </li> + <li> + <span class="glyphicon glyphicon-upload"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-upload</span> + </li> + <li> + <span class="glyphicon glyphicon-usd"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-usd</span> + </li> + <li> + <span class="glyphicon glyphicon-user"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-user</span> + </li> + <li> + <span class="glyphicon glyphicon-volume-down"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-volume-down</span> + </li> + <li> + <span class="glyphicon glyphicon-volume-off"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-volume-off</span> + </li> + <li> + <span class="glyphicon glyphicon-volume-up"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-volume-up</span> + </li> + <li> + <span class="glyphicon glyphicon-warning-sign"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-warning-sign</span> + </li> + <li> + <span class="glyphicon glyphicon-wrench"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-wrench</span> + </li> + <li> + <span class="glyphicon glyphicon-zoom-in"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-zoom-in</span> + </li> + <li> + <span class="glyphicon glyphicon-zoom-out"></span> + <span class="glyphicon-class">.glyphicon .glyphicon-zoom-out</span> + </li> </ul> @@ -918,6 +1518,11 @@ base_url: "../" <h4>Tooltips & popovers in input groups require special setting</h4> <p>When using tooltips or popovers on elements within an <code>.input-group</code>, you'll have to specify the option <code>container: 'body'</code> to avoid unwanted side effects (such as the element growing wider and/or losing its rounded corners when the tooltip or popover is triggered).</p> </div> + <div class="bs-callout bs-callout-info"> + <h4>Don't mix with form groups</h4> + <p>Do not apply input group classes directly to form groups. An input group is an isolated component.</p> + </div> + <h2 id="input-groups-basic">Basic example</h2> <form class="bs-example bs-example-form" role="form"> @@ -977,7 +1582,7 @@ base_url: "../" {% highlight html %} <div class="input-group input-group-lg"> <span class="input-group-addon">@</span> - <input type="text" class="form-control input-lg" placeholder="Username"> + <input type="text" class="form-control" placeholder="Username"> </div> <div class="input-group"> @@ -1416,12 +2021,16 @@ base_url: "../" <h4>Customize the collapsing point</h4> <p>Depending on the content in your navbar, you might need to change the point at which your navbar switches between collapsed and horizontal mode. Customize the <code>@grid-float-breakpoint</code> variable or add your own media query.</p> </div> + <div class="bs-callout bs-callout-warning" id="multiple-navbars-warning"> + <h4>Multiple navbars require custom code</h4> + <p>Multiple nearby navbars with dropdown menus are not supported by default. You will need to override the <code>z-index</code>es of the dropdown menus yourself. Otherwise, the dropdown menu will display behind the other navbar.</p> + </div> <div class="bs-example"> <nav class="navbar navbar-default" role="navigation"> <!-- Brand and toggle get grouped for better mobile display --> <div class="navbar-header"> - <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse"> + <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> @@ -1431,7 +2040,7 @@ base_url: "../" </div> <!-- Collect the nav links, forms, and other content for toggling --> - <div class="collapse navbar-collapse navbar-ex1-collapse"> + <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> <ul class="nav navbar-nav"> <li class="active"><a href="#">Link</a></li> <li><a href="#">Link</a></li> @@ -1441,7 +2050,9 @@ base_url: "../" <li><a href="#">Action</a></li> <li><a href="#">Another action</a></li> <li><a href="#">Something else here</a></li> + <li class="divider"></li> <li><a href="#">Separated link</a></li> + <li class="divider"></li> <li><a href="#">One more separated link</a></li> </ul> </li> @@ -1460,6 +2071,7 @@ base_url: "../" <li><a href="#">Action</a></li> <li><a href="#">Another action</a></li> <li><a href="#">Something else here</a></li> + <li class="divider"></li> <li><a href="#">Separated link</a></li> </ul> </li> @@ -1471,7 +2083,7 @@ base_url: "../" <nav class="navbar navbar-default" role="navigation"> <!-- Brand and toggle get grouped for better mobile display --> <div class="navbar-header"> - <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse"> + <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> @@ -1481,7 +2093,7 @@ base_url: "../" </div> <!-- Collect the nav links, forms, and other content for toggling --> - <div class="collapse navbar-collapse navbar-ex1-collapse"> + <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> <ul class="nav navbar-nav"> <li class="active"><a href="#">Link</a></li> <li><a href="#">Link</a></li> @@ -1491,7 +2103,9 @@ base_url: "../" <li><a href="#">Action</a></li> <li><a href="#">Another action</a></li> <li><a href="#">Something else here</a></li> + <li class="divider"></li> <li><a href="#">Separated link</a></li> + <li class="divider"></li> <li><a href="#">One more separated link</a></li> </ul> </li> @@ -1510,6 +2124,7 @@ base_url: "../" <li><a href="#">Action</a></li> <li><a href="#">Another action</a></li> <li><a href="#">Something else here</a></li> + <li class="divider"></li> <li><a href="#">Separated link</a></li> </ul> </li> @@ -1518,15 +2133,15 @@ base_url: "../" </nav> {% endhighlight %} -<div class="bs-callout bs-callout-danger"> - <h4>Plugin dependency</h4> - <p>The responsive navbar requires the <a href="../javascript/#collapse">collapse plugin</a> to be included in your version of Bootstrap.</p> -</div> + <div class="bs-callout bs-callout-danger"> + <h4>Plugin dependency</h4> + <p>The responsive navbar requires the <a href="../javascript/#collapse">collapse plugin</a> to be included in your version of Bootstrap.</p> + </div> -<div class="bs-callout bs-callout-warning"> - <h4>Make navbars accessible</h4> - <p>Be sure to add a <code>role="navigation"</code> to every navbar to help with accessibility.</p> -</div> + <div class="bs-callout bs-callout-warning"> + <h4>Make navbars accessible</h4> + <p>Be sure to add a <code>role="navigation"</code> to every navbar to help with accessibility.</p> + </div> <h2 id="navbar-forms">Forms</h2> @@ -1535,7 +2150,7 @@ base_url: "../" <div class="bs-example"> <nav class="navbar navbar-default" role="navigation"> <div class="navbar-header"> - <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex2-collapse"> + <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-2"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> @@ -1543,7 +2158,7 @@ base_url: "../" </button> <a class="navbar-brand" href="#">Brand</a> </div> - <div class="collapse navbar-collapse navbar-ex2-collapse"> + <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-2"> <form class="navbar-form navbar-left" role="search"> <div class="form-group"> <input type="text" class="form-control" placeholder="Search"> @@ -1562,13 +2177,18 @@ base_url: "../" </form> {% endhighlight %} + <div class="bs-callout bs-callout-danger"> + <h4>Always add labels</h4> + <p>Screen readers will have trouble with your forms if you don't include a label for every input. For these inline navbar forms, you can hide the labels using the <code>.sr-only</code> class.</p> + </div> + <h2 id="navbar-buttons">Buttons</h2> - <p>For buttons not residing in a <code><form></code>, add this class to vertically center buttons within a navbar.</p> + <p>Add the <code>.navbar-btn</code> class to <code><button></code> elements not residing in a <code><form></code> to vertically center them in the navbar.</p> <div class="bs-example"> <nav class="navbar navbar-default" role="navigation"> <div class="navbar-header"> - <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex3-collapse"> + <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-3"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> @@ -1576,7 +2196,7 @@ base_url: "../" </button> <a class="navbar-brand" href="#">Brand</a> </div> - <div class="collapse navbar-collapse navbar-ex3-collapse"> + <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-3"> <button type="button" class="btn btn-default navbar-btn">Sign in</button> </div> </nav> @@ -1585,13 +2205,17 @@ base_url: "../" <button type="button" class="btn btn-default navbar-btn">Sign in</button> {% endhighlight %} + <div class="bs-callout bs-callout-warning"> + <h4>Context-specific usage</h4> + <p>Like the standard <a href="{{ page.base_url }}css#buttons">button classes</a>, <code>.navbar-btn</code> can be used on <code><a></code> and <code><input></code> elements. However, neither <code>.navbar-btn</code> nor the standard button classes should be used on <code><a></code> elements within <code>.navbar-nav</code>.</p> + </div> <h2 id="navbar-text">Text</h2> <p>Wrap strings of text in an element with <code>.navbar-text</code>, usually on a <code><p></code> tag for proper leading and color.</p> <div class="bs-example"> <nav class="navbar navbar-default" role="navigation"> <div class="navbar-header"> - <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex4-collapse"> + <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-4"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> @@ -1599,7 +2223,7 @@ base_url: "../" </button> <a class="navbar-brand" href="#">Brand</a> </div> - <div class="collapse navbar-collapse navbar-ex4-collapse"> + <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-4"> <p class="navbar-text">Signed in as Mark Otto</p> </div> </nav> @@ -1614,7 +2238,7 @@ base_url: "../" <div class="bs-example"> <nav class="navbar navbar-default" role="navigation"> <div class="navbar-header"> - <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex5-collapse"> + <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-5"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> @@ -1622,7 +2246,7 @@ base_url: "../" </button> <a class="navbar-brand" href="#">Brand</a> </div> - <div class="collapse navbar-collapse navbar-ex5-collapse"> + <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-5"> <p class="navbar-text pull-right">Signed in as <a href="#" class="navbar-link">Mark Otto</a></p> </div> </nav> @@ -1643,7 +2267,7 @@ base_url: "../" <nav class="navbar navbar-default navbar-fixed-top" role="navigation"> <!-- Brand and toggle get grouped for better mobile display --> <div class="navbar-header"> - <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex6-collapse"> + <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-6"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> @@ -1653,7 +2277,7 @@ base_url: "../" </div> <!-- Collect the nav links, forms, and other content for toggling --> - <div class="collapse navbar-collapse navbar-ex6-collapse"> + <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-6"> <ul class="nav navbar-nav"> <li class="active"><a href="#">Home</a></li> <li><a href="#">Link</a></li> @@ -1684,7 +2308,7 @@ body { padding-top: 70px; } <nav class="navbar navbar-default navbar-fixed-bottom" role="navigation"> <!-- Brand and toggle get grouped for better mobile display --> <div class="navbar-header"> - <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex7-collapse"> + <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-7"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> @@ -1694,7 +2318,7 @@ body { padding-top: 70px; } </div> <!-- Collect the nav links, forms, and other content for toggling --> - <div class="collapse navbar-collapse navbar-ex7-collapse"> + <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-7"> <ul class="nav navbar-nav"> <li class="active"><a href="#">Home</a></li> <li><a href="#">Link</a></li> @@ -1725,7 +2349,7 @@ body { padding-bottom: 70px; } <nav class="navbar navbar-default navbar-static-top" role="navigation"> <!-- Brand and toggle get grouped for better mobile display --> <div class="navbar-header"> - <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex8-collapse"> + <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-8"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> @@ -1735,7 +2359,7 @@ body { padding-bottom: 70px; } </div> <!-- Collect the nav links, forms, and other content for toggling --> - <div class="collapse navbar-collapse navbar-ex8-collapse"> + <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-8"> <ul class="nav navbar-nav"> <li class="active"><a href="#">Home</a></li> <li><a href="#">Link</a></li> @@ -1757,7 +2381,7 @@ body { padding-bottom: 70px; } <nav class="navbar navbar-inverse" role="navigation"> <!-- Brand and toggle get grouped for better mobile display --> <div class="navbar-header"> - <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex9-collapse"> + <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-9"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> @@ -1767,7 +2391,7 @@ body { padding-bottom: 70px; } </div> <!-- Collect the nav links, forms, and other content for toggling --> - <div class="collapse navbar-collapse navbar-ex9-collapse"> + <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-9"> <ul class="nav navbar-nav"> <li class="active"><a href="#">Home</a></li> <li><a href="#">Link</a></li> @@ -2091,25 +2715,30 @@ body { padding-bottom: 70px; } <div class="page-header"> <h1 id="jumbotron">Jumbotron</h1> </div> - <p>A lightweight, flexible component that can optional extend the entire viewport to showcase key content on your site. To make the jumbotron full width, don't include it within a <code>.container</code>. Placing it within a container will keep it at the width of the rest of your content and provide rounded corners.</p> + <p>A lightweight, flexible component that can optionally extend the entire viewport to showcase key content on your site.</p> <div class="bs-example"> <div class="jumbotron"> - <div class="container"> - <h1>Hello, world!</h1> - <p>This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.</p> - <p><a class="btn btn-primary btn-lg" role="button">Learn more</a></p> - </div> + <h1>Hello, world!</h1> + <p>This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.</p> + <p><a class="btn btn-primary btn-lg" role="button">Learn more</a></p> </div> </div> {% highlight html %} <div class="jumbotron"> + <h1>Hello, world!</h1> + <p>...</p> + <p><a class="btn btn-primary btn-lg" role="button">Learn more</a></p> +</div> +{% endhighlight %} + <p>To make the jumbotron full width, and without rounded corners, place it outside all <code>.container</code>s and instead add a <code>.container</code> within.</p> +{% highlight html %} +<div class="jumbotron"> <div class="container"> - <h1>Hello, world!</h1> - <p>...</p> - <p><a class="btn btn-primary btn-lg" role="button">Learn more</a></p> + ... </div> </div> {% endhighlight %} + </div> |
