انواع آیکن ها در بوت استرپ

چاپ

آیکن های نمادین

بوتسترپ شامل 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>

خودتان امتحان کنید »

 

نام کلاس مثال
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: آیکن ها را تنها در عناصر خالی استفاده کنید:

کلاس های آیکن باید تنها در عناصری استفاده شوند که شامل محتوای متنی نباشند، و همچنین دارای عناصر فرزند نیز نباشند.