انواع آیکن ها در بوت استرپ
آیکن های نمادین
بوتسترپ شامل 200 آیکن نمادین می باشد.
می توانید از این آیکن های نمادین در دکمه ها و نوارابزارها و ناوبری ها یا فرم ها استفاده کنید:
Bootstrap Glyph مثال
<p>Envelope icon: <span class="glyphicon glyphicon-envelope"></span></p>
<p>Search icon: <span class="glyphicon glyphicon-search"></span></p>
<p>Print icon: <span class="glyphicon glyphicon-print"></span></p>
<p>Search icon: <span class="glyphicon glyphicon-search"></span></p>
<p>Print icon: <span class="glyphicon glyphicon-print"></span></p>
خودتان امتحان کنید »
| نام کلاس | مثال |
|---|---|
| glyphicon glyphicon-asterisk | مشاهده خروجی آیکن |
| glyphicon glyphicon-plus | مشاهده خروجی آیکن |
| glyphicon glyphicon-minus | مشاهده خروجی آیکن |
| glyphicon glyphicon-euro | مشاهده خروجی آیکن |
| glyphicon glyphicon-cloud | مشاهده خروجی آیکن |
| glyphicon glyphicon-envelope | مشاهده خروجی آیکن |
| glyphicon glyphicon-pencil | مشاهده خروجی آیکن |
| glyphicon glyphicon-glass | مشاهده خروجی آیکن |
| glyphicon glyphicon-music | مشاهده خروجی آیکن |
| glyphicon glyphicon-search | مشاهده خروجی آیکن |
| glyphicon glyphicon-heart | مشاهده خروجی آیکن |
| glyphicon glyphicon-star | مشاهده خروجی آیکن |
| glyphicon glyphicon-star-empty | مشاهده خروجی آیکن |
| glyphicon glyphicon-user | مشاهده خروجی آیکن |
| glyphicon glyphicon-film | مشاهده خروجی آیکن |
| glyphicon glyphicon-th-large | مشاهده خروجی آیکن |
| glyphicon glyphicon-th | مشاهده خروجی آیکن |
| glyphicon glyphicon-th-list | مشاهده خروجی آیکن |
| glyphicon glyphicon-ok | مشاهده خروجی آیکن |
| glyphicon glyphicon-remove | مشاهده خروجی آیکن |
| glyphicon glyphicon-zoom-in | مشاهده خروجی آیکن |
| glyphicon glyphicon-zoom-out | مشاهده خروجی آیکن |
| glyphicon glyphicon-off | مشاهده خروجی آیکن |
| glyphicon glyphicon-signal | مشاهده خروجی آیکن |
| glyphicon glyphicon-cog | مشاهده خروجی آیکن |
| glyphicon glyphicon-trash | مشاهده خروجی آیکن |
| glyphicon glyphicon-home | مشاهده خروجی آیکن |
| glyphicon glyphicon-file | مشاهده خروجی آیکن |
| glyphicon glyphicon-time | مشاهده خروجی آیکن |
| glyphicon glyphicon-road | مشاهده خروجی آیکن |
| glyphicon glyphicon-download-alt | مشاهده خروجی آیکن |
| glyphicon glyphicon-download | مشاهده خروجی آیکن |
| glyphicon glyphicon-upload | مشاهده خروجی آیکن |
| glyphicon glyphicon-inbox | مشاهده خروجی آیکن |
| glyphicon glyphicon-play-circle | مشاهده خروجی آیکن |
| glyphicon glyphicon-repeat | مشاهده خروجی آیکن |
| glyphicon glyphicon-refresh | مشاهده خروجی آیکن |
| glyphicon glyphicon-list-alt | مشاهده خروجی آیکن |
| glyphicon glyphicon-lock | مشاهده خروجی آیکن |
| glyphicon glyphicon-flag | مشاهده خروجی آیکن |
| glyphicon glyphicon-headphones | مشاهده خروجی آیکن |
| glyphicon glyphicon-volume-off | مشاهده خروجی آیکن |
| glyphicon glyphicon-volume-down | مشاهده خروجی آیکن |
| glyphicon glyphicon-volume-up | مشاهده خروجی آیکن |
| glyphicon glyphicon-qrcode | مشاهده خروجی آیکن |
| glyphicon glyphicon-barcode | مشاهده خروجی آیکن |
| glyphicon glyphicon-tag | مشاهده خروجی آیکن |
| glyphicon glyphicon-tags | مشاهده خروجی آیکن |
| glyphicon glyphicon-book | مشاهده خروجی آیکن |
| glyphicon glyphicon-bookmark | مشاهده خروجی آیکن |
| glyphicon glyphicon-print | مشاهده خروجی آیکن |
| glyphicon glyphicon-camera | مشاهده خروجی آیکن |
| glyphicon glyphicon-font | مشاهده خروجی آیکن |
| glyphicon glyphicon-bold | مشاهده خروجی آیکن |
| glyphicon glyphicon-italic | مشاهده خروجی آیکن |
| glyphicon glyphicon-text-height | مشاهده خروجی آیکن |
| glyphicon glyphicon-text-width | مشاهده خروجی آیکن |
| glyphicon glyphicon-align-left | مشاهده خروجی آیکن |
| glyphicon glyphicon-align-center | مشاهده خروجی آیکن |
| glyphicon glyphicon-align-right | مشاهده خروجی آیکن |
| glyphicon glyphicon-align-justify | مشاهده خروجی آیکن |
| glyphicon glyphicon-list | مشاهده خروجی آیکن |
| glyphicon glyphicon-indent-left | مشاهده خروجی آیکن |
| glyphicon glyphicon-indent-right | مشاهده خروجی آیکن |
| glyphicon glyphicon-facetime-video | مشاهده خروجی آیکن |
| glyphicon glyphicon-picture | مشاهده خروجی آیکن |
| glyphicon glyphicon-map-marker | مشاهده خروجی آیکن |
| glyphicon glyphicon-adjust | مشاهده خروجی آیکن |
| glyphicon glyphicon-tint | مشاهده خروجی آیکن |
| glyphicon glyphicon-edit | مشاهده خروجی آیکن |
| glyphicon glyphicon-share | مشاهده خروجی آیکن |
| glyphicon glyphicon-check | مشاهده خروجی آیکن |
| glyphicon glyphicon-move | مشاهده خروجی آیکن |
| glyphicon glyphicon-step-backward | مشاهده خروجی آیکن |
| glyphicon glyphicon-fast-backward | مشاهده خروجی آیکن |
| glyphicon glyphicon-backward | مشاهده خروجی آیکن |
| glyphicon glyphicon-play | مشاهده خروجی آیکن |
| glyphicon glyphicon-pause | مشاهده خروجی آیکن |
| glyphicon glyphicon-stop | مشاهده خروجی آیکن |
| glyphicon glyphicon-forward | مشاهده خروجی آیکن |
| glyphicon glyphicon-fast-forward | مشاهده خروجی آیکن |
| glyphicon glyphicon-step-forward | مشاهده خروجی آیکن |
| glyphicon glyphicon-eject | مشاهده خروجی آیکن |
| glyphicon glyphicon-chevron-left | مشاهده خروجی آیکن |
| glyphicon glyphicon-chevron-right | مشاهده خروجی آیکن |
| glyphicon glyphicon-plus-sign | مشاهده خروجی آیکن |
| glyphicon glyphicon-minus-sign | مشاهده خروجی آیکن |
| glyphicon glyphicon-remove-sign | مشاهده خروجی آیکن |
| glyphicon glyphicon-ok-sign | مشاهده خروجی آیکن |
| glyphicon glyphicon-question-sign | مشاهده خروجی آیکن |
| glyphicon glyphicon-info-sign | مشاهده خروجی آیکن |
| glyphicon glyphicon-screenshot | مشاهده خروجی آیکن |
| glyphicon glyphicon-remove-circle | مشاهده خروجی آیکن |
| glyphicon glyphicon-ok-circle | مشاهده خروجی آیکن |
| glyphicon glyphicon-ban-circle | مشاهده خروجی آیکن |
| glyphicon glyphicon-arrow-left | مشاهده خروجی آیکن |
| glyphicon glyphicon-arrow-right | مشاهده خروجی آیکن |
| glyphicon glyphicon-arrow-up | مشاهده خروجی آیکن |
| glyphicon glyphicon-arrow-down | مشاهده خروجی آیکن |
| glyphicon glyphicon-share-alt | مشاهده خروجی آیکن |
| glyphicon glyphicon-resize-full | مشاهده خروجی آیکن |
| glyphicon glyphicon-resize-small | مشاهده خروجی آیکن |
| glyphicon glyphicon-exclamation-sign | مشاهده خروجی آیکن |
| glyphicon glyphicon-gift | مشاهده خروجی آیکن |
| glyphicon glyphicon-leaf | مشاهده خروجی آیکن |
| glyphicon glyphicon-fire | مشاهده خروجی آیکن |
| glyphicon glyphicon-eye-open | مشاهده خروجی آیکن |
| glyphicon glyphicon-eye-close | مشاهده خروجی آیکن |
| glyphicon glyphicon-warning-sign | مشاهده خروجی آیکن |
| glyphicon glyphicon-plane | مشاهده خروجی آیکن |
| glyphicon glyphicon-calendar | مشاهده خروجی آیکن |
| glyphicon glyphicon-random | مشاهده خروجی آیکن |
| glyphicon glyphicon-comment | مشاهده خروجی آیکن |
| glyphicon glyphicon-magnet | مشاهده خروجی آیکن |
| glyphicon glyphicon-chevron-up | مشاهده خروجی آیکن |
| glyphicon glyphicon-chevron-down | مشاهده خروجی آیکن |
| glyphicon glyphicon-retweet | مشاهده خروجی آیکن |
| glyphicon glyphicon-shopping-cart | مشاهده خروجی آیکن |
| glyphicon glyphicon-folder-close | مشاهده خروجی آیکن |
| glyphicon glyphicon-folder-open | مشاهده خروجی آیکن |
| glyphicon glyphicon-resize-vertical | مشاهده خروجی آیکن |
| glyphicon glyphicon-resize-horizontal | مشاهده خروجی آیکن |
| glyphicon glyphicon-hdd | مشاهده خروجی آیکن |
| glyphicon glyphicon-bullhorn | مشاهده خروجی آیکن |
| glyphicon glyphicon-bell | مشاهده خروجی آیکن |
| glyphicon glyphicon-certificate | مشاهده خروجی آیکن |
| glyphicon glyphicon-thumbs-up | مشاهده خروجی آیکن |
| glyphicon glyphicon-thumbs-down | مشاهده خروجی آیکن |
| glyphicon glyphicon-hand-right | مشاهده خروجی آیکن |
| glyphicon glyphicon-hand-left | مشاهده خروجی آیکن |
| glyphicon glyphicon-hand-up | مشاهده خروجی آیکن |
| glyphicon glyphicon-hand-down | مشاهده خروجی آیکن |
| glyphicon glyphicon-circle-arrow-right | مشاهده خروجی آیکن |
| glyphicon glyphicon-circle-arrow-left | مشاهده خروجی آیکن |
| glyphicon glyphicon-circle-arrow-up | مشاهده خروجی آیکن |
| glyphicon glyphicon-circle-arrow-down | مشاهده خروجی آیکن |
| glyphicon glyphicon-globe | مشاهده خروجی آیکن |
| glyphicon glyphicon-wrench | مشاهده خروجی آیکن |
| glyphicon glyphicon-tasks | مشاهده خروجی آیکن |
| glyphicon glyphicon-filter | مشاهده خروجی آیکن |
| glyphicon glyphicon-briefcase | مشاهده خروجی آیکن |
| glyphicon glyphicon-fullscreen | مشاهده خروجی آیکن |
| glyphicon glyphicon-dashboard | مشاهده خروجی آیکن |
| glyphicon glyphicon-paperclip | مشاهده خروجی آیکن |
| glyphicon glyphicon-heart-empty | مشاهده خروجی آیکن |
| glyphicon glyphicon-link | مشاهده خروجی آیکن |
| glyphicon glyphicon-phone | مشاهده خروجی آیکن |
| glyphicon glyphicon-pushpin | مشاهده خروجی آیکن |
| glyphicon glyphicon-usd | مشاهده خروجی آیکن |
| glyphicon glyphicon-gbp | مشاهده خروجی آیکن |
| glyphicon glyphicon-sort | مشاهده خروجی آیکن |
| glyphicon glyphicon-sort-by-alphabet | مشاهده خروجی آیکن |
| glyphicon glyphicon-sort-by-alphabet-alt | مشاهده خروجی آیکن |
| glyphicon glyphicon-sort-by-order | مشاهده خروجی آیکن |
| glyphicon glyphicon-sort-by-order-alt | مشاهده خروجی آیکن |
| glyphicon glyphicon-sort-by-attributes | مشاهده خروجی آیکن |
| glyphicon glyphicon-sort-by-attributes-alt | مشاهده خروجی آیکن |
| glyphicon glyphicon-unchecked | مشاهده خروجی آیکن |
| glyphicon glyphicon-expand | مشاهده خروجی آیکن |
| glyphicon glyphicon-collapse-down | مشاهده خروجی آیکن |
| glyphicon glyphicon-collapse-up | مشاهده خروجی آیکن |
| glyphicon glyphicon-log-in | مشاهده خروجی آیکن |
| glyphicon glyphicon-flash | مشاهده خروجی آیکن |
| glyphicon glyphicon-log-out | مشاهده خروجی آیکن |
| glyphicon glyphicon-new-window | مشاهده خروجی آیکن |
| glyphicon glyphicon-record | مشاهده خروجی آیکن |
| glyphicon glyphicon-save | مشاهده خروجی آیکن |
| glyphicon glyphicon-open | مشاهده خروجی آیکن |
| glyphicon glyphicon-saved | مشاهده خروجی آیکن |
| glyphicon glyphicon-import | مشاهده خروجی آیکن |
| glyphicon glyphicon-export | مشاهده خروجی آیکن |
| glyphicon glyphicon-send | مشاهده خروجی آیکن |
| glyphicon glyphicon-floppy-disk | مشاهده خروجی آیکن |
| glyphicon glyphicon-floppy-saved | مشاهده خروجی آیکن |
| glyphicon glyphicon-floppy-remove | مشاهده خروجی آیکن |
| glyphicon glyphicon-floppy-save | مشاهده خروجی آیکن |
| glyphicon glyphicon-floppy-open | مشاهده خروجی آیکن |
| glyphicon glyphicon-credit-card | مشاهده خروجی آیکن |
| glyphicon glyphicon-transfer | مشاهده خروجی آیکن |
| glyphicon glyphicon-cutlery | مشاهده خروجی آیکن |
| glyphicon glyphicon-header | مشاهده خروجی آیکن |
| glyphicon glyphicon-compressed | مشاهده خروجی آیکن |
| glyphicon glyphicon-earphone | مشاهده خروجی آیکن |
| glyphicon glyphicon-phone-alt | مشاهده خروجی آیکن |
| glyphicon glyphicon-tower | مشاهده خروجی آیکن |
| glyphicon glyphicon-stats | مشاهده خروجی آیکن |
| glyphicon glyphicon-sd-video | مشاهده خروجی آیکن |
| glyphicon glyphicon-hd-video | مشاهده خروجی آیکن |
| glyphicon glyphicon-subtitles | مشاهده خروجی آیکن |
| glyphicon glyphicon-sound-stereo | مشاهده خروجی آیکن |
| glyphicon glyphicon-sound-dolby | مشاهده خروجی آیکن |
| glyphicon glyphicon-sound-5-1 | مشاهده خروجی آیکن |
| glyphicon glyphicon-sound-6-1 | مشاهده خروجی آیکن |
| glyphicon glyphicon-sound-7-1 | مشاهده خروجی آیکن |
| glyphicon glyphicon-copyright-mark | مشاهده خروجی آیکن |
| glyphicon glyphicon-registration-mark | مشاهده خروجی آیکن |
| glyphicon glyphicon-cloud-download | مشاهده خروجی آیکن |
| glyphicon glyphicon-cloud-upload | مشاهده خروجی آیکن |
| glyphicon glyphicon-tree-conifer | مشاهده خروجی آیکن |
| glyphicon glyphicon-tree-deciduous | مشاهده خروجی آیکن |
نکته 1: آیکن های نمادین را با دیگر کامپوننت ها ترکیب نکنید:
کلاس های آیکن نمی توانند به طور مستقیم، با دیگر کامپوننت ها ترکیب شوند و از آنها نباید در کنار دیگر کلاس ها در یک عنصر یکسان استفاده کرد. به جای آن می توانید از یک <span> تو در تو استفاده کرده و کلاس های آیکن را درون آن استفاده کنید.
نکته 2: آیکن ها را تنها در عناصر خالی استفاده کنید:
کلاس های آیکن باید تنها در عناصری استفاده شوند که شامل محتوای متنی نباشند، و همچنین دارای عناصر فرزند نیز نباشند.
- نوشته شده توسط احسان عباسی
- بازدید: 18536
دیدگاه‌ها
لینک ها خرابه?
با سلام
تمامی لینک ها تست شدن و سالم هستن
لینک ها خرابه!
با سلام
لینک ها به زودی اصلاح خواهند شد.