Icon Tools - Operator Sekolah

Tulis di atas kode </head>

<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet"/>

Penulisan :

<i class="fa fa-html5"></i> fa-html5

Penulisan Icon pada Edit HTML <i class="fa fa-html5"></i> fa-html5 Penulisan dengan mengatur ukuran icon fa-html5
Untuk memperbesar ukuran, maka anda hanya perlu menambahkan class fa-lg, fa-1x, fa-2x, fa-3x, fa-4x, fa-5x dan berikut contohnya:

<p><i class="fa fa-html5 fa-lg"></i> fa-html5</p>
<p><i class="fa fa-html5 fa-2x"></i> fa-html5</p>
<p><i class="fa fa-html5 fa-3x"></i> fa-html5</p>
<p><i class="fa fa-html5 fa-4x"></i> fa-html5</p>
<p><i class="fa fa-html5 fa-5x"></i> fa-html5</p>

fa-html5
fa-html5
fa-html5
fa-html5

Gunakan class fa-ul dan fa-li untuk mempermudah dalam membuat daftar list dan menentukan nama icon.

Penulisan:

<ul class="fa-ul">
  <li><i class="fa-li fa fa-check-square"></i>fa-check-square</li>
  <li><i class="fa-li fa fa-check-square"></i>fa-check-square</li>
  <li><i class="fa-li fa fa-spinner fa-spin"></i>fa-spinner fa-spin</li>
  <li><i class="fa-li fa fa-square"></i>fa-square</li>
</ul>


fa-check-square
fa-check-square
fa-spinner fa-spin
fa-square

Ini adalah contoh agar icon berada disebelah kiri, agar berada disebelah kanan maka ganti pull-left dengan pull-right.

<i class="fa fa-info-circle fa-2x pull-left fa-border"></i>
Ini adalah contoh agar icon berada disebelah kiri, agar berada disebelah kanan maka ganti pull-left dengan pull-right.

Contoh :

Ini adalah contoh agar icon berada disebelah kiri, agar berada disebelah kanan maka ganti pull-left dengan pull-right.

Rotasi :

<i class="fa fa-shield"></i>  normal<br>
<i class="fa fa-shield fa-rotate-90"></i>  fa-rotate-90<br>
<i class="fa fa-shield fa-rotate-180"></i>  fa-rotate-180<br>
<i class="fa fa-shield fa-rotate-270"></i>  fa-rotate-270<br>
<i class="fa fa-shield fa-flip-horizontal"></i>  fa-flip-horizontal<br>
<i class="fa fa-shield fa-flip-vertical"></i>  icon-flip-vertical

Contoh :
normal

fa-rotate-90

fa-rotate-180

fa-rotate-270

fa-flip-horizontal

icon-flip-vertical

Gunakan class fa-spin untuk membuat icon agar bisa berputar. Ini biasa di kombinasikan pada icon fa-spinner, fa-refresh, dan fa-gigi agar bisa berputar dengan baik. Namun sayangnya animasi CSS3 ini tidak support di IE8 - IE9.

<i class="fa fa-spinner fa-spin"></i>
<i class="fa fa-refresh fa-spin"></i>
<i class="fa fa-cog fa-spin"></i>

fa-glass "\f000"
fa-music "\f001"
fa-search "\f002"
fa-envelope-o "\f003"
fa-heart "\f004"
fa-star "\f005"
fa-star-o "\f006"
fa-user "\f007"
fa-film "\f008"
fa-th-large "\f009"
fa-th "\f00a"
fa-th-list "\f00b"
fa-check "\f00c"
fa-times "\f00d"
fa-search-plus "\f00e"
fa-search-minus "\f010"
fa-power-off "\f011"
fa-signal "\f012"
fa-cog "\f013"
fa-trash-o "\f014"
fa-home "\f015"
fa-file-o "\f016"
fa-clock-o "\f017"
fa-road "\f018"
fa-download "\f019"
fa-arrow-circle-o-down "\f01a"
fa-arrow-circle-o-up "\f01b"
fa-inbox "\f01c"
fa-play-circle-o "\f01d"
fa-repeat "\f01e"
fa-refresh "\f021"
fa-list-alt "\f022"
fa-lock "\f023"
fa-flag "\f024"
fa-headphones "\f025"
fa-volume-off "\f026"
fa-volume-down "\f027"
fa-volume-up "\f028"
fa-qrcode "\f029"
fa-barcode "\f02a"
fa-tag "\f02b"
fa-tags "\f02c"
fa-book "\f02d"
fa-bookmark "\f02e"
fa-print "\f02f"
fa-camera "\f030"
fa-font "\f031"
fa-bold "\f032"
fa-italic "\f033"
fa-text-height "\f034"
fa-text-width "\f035"
fa-align-left "\f036"
fa-align-center "\f037"
fa-align-right "\f038"
fa-align-justify "\f039"
fa-list "\f03a"
fa-outdent "\f03b"
fa-indent "\f03c"
fa-video-camera "\f03d"
fa-picture-o "\f03e"
fa-pencil "\f040"
fa-map-marker "\f041"
fa-adjust "\f042"
fa-tint "\f043"
fa-pencil-square-o "\f044"
fa-share-square-o "\f045"
fa-check-square-o "\f046"
fa-arrows "\f047"
fa-step-backward "\f048"
fa-fast-backward "\f049"
fa-backward "\f04a"
fa-play "\f04b"
fa-pause "\f04c"
fa-stop "\f04d"
fa-forward "\f04e"
fa-fast-forward "\f050"
fa-step-forward "\f051"
fa-eject "\f052"
fa-chevron-left "\f053"
fa-chevron-right "\f054"
fa-plus-circle "\f055"
fa-minus-circle "\f056"
fa-times-circle "\f057"
fa-check-circle "\f058"
fa-question-circle "\f059"
fa-info-circle "\f05a"
fa-crosshairs "\f05b"
fa-times-circle-o "\f05c"
fa-check-circle-o "\f05d"
fa-ban "\f05e"
fa-arrow-left "\f060"
fa-arrow-right "\f061"
fa-arrow-up "\f062"
fa-arrow-down "\f063"
fa-share "\f064"
fa-expand "\f065"
fa-compress "\f066"
fa-plus "\f067"
fa-minus "\f068"
fa-asterisk "\f069"
fa-exclamation-circle "\f06a"
fa-gift "\f06b"
fa-leaf "\f06c"
fa-fire "\f06d"
fa-eye "\f06e"
fa-eye-slash "\f070"
fa-exclamation-triangle "\f071"
fa-plane "\f072"
fa-calendar "\f073"
fa-random "\f074"
fa-comment "\f075"
fa-magnet "\f076"
fa-chevron-up "\f077"
fa-chevron-down "\f078"
fa-retweet "\f079"
fa-shopping-cart "\f07a"
fa-folder "\f07b"
fa-folder-open "\f07c"
fa-arrows-v "\f07d"
fa-arrows-h "\f07e"
fa-bar-chart-o "\f080"
fa-twitter-square "\f081"
fa-facebook-square "\f082"
fa-camera-retro "\f083"
fa-key "\f084"
fa-cogs "\f085"
fa-comments "\f086"
fa-thumbs-o-up "\f087"
fa-thumbs-o-down "\f088"
fa-star-half "\f089"
fa-heart-o "\f08a"
fa-sign-out "\f08b"
fa-linkedin-square "\f08c"
fa-thumb-tack "\f08d"
fa-external-link "\f08e"
fa-sign-in "\f090"
fa-trophy "\f091"
fa-github-square "\f092"
fa-upload "\f093"
fa-lemon-o "\f094"
fa-phone "\f095"
fa-square-o "\f096"
fa-bookmark-o "\f097"
fa-phone-square "\f098"
fa-twitter "\f099"
fa-facebook "\f09a"
fa-github "\f09b"
fa-unlock "\f09c"
fa-credit-card "\f09d"
fa-rss "\f09e"
fa-hdd-o "\f0a0"
fa-bullhorn "\f0a1"
fa-bell "\f0f3"
fa-certificate "\f0a3"
fa-hand-o-right "\f0a4"
fa-hand-o-left "\f0a5"
fa-hand-o-up "\f0a6"
fa-hand-o-down "\f0a7"
fa-arrow-circle-left "\f0a8"
fa-arrow-circle-right "\f0a9"
fa-arrow-circle-up "\f0aa"
fa-arrow-circle-down "\f0ab"
fa-globe "\f0ac"
fa-wrench "\f0ad"
fa-tasks "\f0ae"
fa-filter "\f0b0"
fa-briefcase "\f0b1"
fa-arrows-alt "\f0b2"
fa-users "\f0c0"
fa-link "\f0c1"
fa-cloud "\f0c2"
fa-flask "\f0c3"
fa-scissors "\f0c4"
fa-files-o "\f0c5"
fa-paperclip "\f0c6"
fa-floppy-o "\f0c7"
fa-square "\f0c8"
fa-bars "\f0c9"
fa-list-ul "\f0ca"
fa-list-ol "\f0cb"
fa-strikethrough "\f0cc"
fa-underline "\f0cd"
fa-table "\f0ce"
fa-magic "\f0d0"
fa-truck "\f0d1"
fa-pinterest "\f0d2"
fa-pinterest-square "\f0d3"
fa-google-plus-square "\f0d4"
fa-google-plus "\f0d5"
fa-money "\f0d6"
fa-caret-down "\f0d7"
fa-caret-up "\f0d8"
fa-caret-left "\f0d9"
fa-caret-right "\f0da"
fa-columns "\f0db"
fa-sort "\f0dc"
fa-sort-asc "\f0dd"
fa-sort-desc "\f0de"
fa-envelope "\f0e0"
fa-linkedin "\f0e1"
fa-undo "\f0e2"
fa-gavel "\f0e3"
fa-tachometer "\f0e4"
fa-comment-o "\f0e5"
fa-comments-o "\f0e6"
fa-bolt "\f0e7"
fa-sitemap "\f0e8"
fa-umbrella "\f0e9"
fa-clipboard "\f0ea"
fa-lightbulb-o "\f0eb"
fa-exchange "\f0ec"
fa-cloud-download "\f0ed"
fa-cloud-upload "\f0ee"
fa-user-md "\f0f0"
fa-stethoscope "\f0f1"
fa-suitcase "\f0f2"
fa-bell-o "\f0a2"
fa-coffee "\f0f4"
fa-cutlery "\f0f5"
fa-file-text-o "\f0f6"
fa-building-o "\f0f7"
fa-hospital-o "\f0f8"
fa-ambulance "\f0f9"
fa-medkit "\f0fa"
fa-fighter-jet "\f0fb"
fa-beer "\f0fc"
fa-h-square "\f0fd"
fa-plus-square "\f0fe"
fa-angle-double-left "\f100"
fa-angle-double-right "\f101"
fa-angle-double-up "\f102"
fa-angle-double-down "\f103"
fa-angle-left "\f104"
fa-angle-right "\f105"
fa-angle-up "\f106"
fa-angle-down "\f107"
fa-desktop "\f108"
fa-laptop "\f109"
fa-tablet "\f10a"
fa-mobile "\f10b"
fa-circle-o "\f10c"
fa-quote-left "\f10d"
fa-quote-right "\f10e"
fa-spinner "\f110"
fa-circle "\f111"
fa-reply "\f112"
fa-github-alt "\f113"
fa-folder-o "\f114"
fa-folder-open-o "\f115"
fa-smile-o "\f118"
fa-frown-o "\f119"
fa-meh-o "\f11a"
fa-gamepad "\f11b"
fa-keyboard-o "\f11c"
fa-flag-o "\f11d"
fa-flag-checkered "\f11e"
fa-terminal "\f120"
fa-code "\f121"
fa-reply-all "\f122"
fa-mail-reply-all "\f122"
fa-star-half-o "\f123"
fa-location-arrow "\f124"
fa-crop "\f125"
fa-code-fork "\f126"
fa-chain-broken "\f127"
fa-question "\f128"
fa-info "\f129"
fa-exclamation "\f12a"
fa-superscript "\f12b"
fa-subscript "\f12c"
fa-eraser "\f12d"
fa-puzzle-piece "\f12e"
fa-microphone "\f130"
fa-microphone-slash "\f131"
fa-shield "\f132"
fa-calendar-o "\f133"
fa-fire-extinguisher "\f134"
fa-rocket "\f135"
fa-maxcdn "\f136"
fa-chevron-circle-left "\f137"
fa-chevron-circle-right "\f138"
fa-chevron-circle-up "\f139"
fa-chevron-circle-down "\f13a"
fa-html5 "\f13b"
fa-css3 "\f13c"
fa-anchor "\f13d"
fa-unlock-alt "\f13e"
fa-bullseye "\f140"
fa-ellipsis-h "\f141"
fa-ellipsis-v "\f142"
fa-rss-square "\f143"
fa-play-circle "\f144"
fa-ticket "\f145"
fa-minus-square "\f146"
fa-minus-square-o "\f147"
fa-level-up "\f148"
fa-level-down "\f149"
fa-check-square "\f14a"
fa-pencil-square "\f14b"
fa-external-link-square "\f14c"
fa-share-square "\f14d"
fa-compass "\f14e"
fa-caret-square-o-down "\f150"
fa-caret-square-o-up "\f151"
fa-caret-square-o-right "\f152"
fa-eur "\f153"
fa-gbp "\f154"
fa-usd "\f155"
fa-inr "\f156"
fa-jpy "\f157"
fa-rub "\f158"
fa-krw "\f159"
fa-btc "\f15a"
fa-file "\f15b"
fa-file-text "\f15c"
fa-sort-alpha-asc "\f15d"
fa-sort-alpha-desc "\f15e"
fa-sort-amount-asc "\f160"
fa-sort-amount-desc "\f161"
fa-sort-numeric-asc "\f162"
fa-sort-numeric-desc "\f163"
fa-thumbs-up "\f164"
fa-thumbs-down "\f165"
fa-youtube-square "\f166"
fa-youtube "\f167"
fa-xing "\f168"
fa-xing-square "\f169"
fa-youtube-play "\f16a"
fa-dropbox "\f16b"
fa-stack-overflow "\f16c"
fa-instagram "\f16d"
fa-flickr "\f16e"
fa-adn "\f170"
fa-bitbucket "\f171"
fa-bitbucket-square "\f172"
fa-tumblr "\f173"
fa-tumblr-square "\f174"
fa-long-arrow-down "\f175"
fa-long-arrow-up "\f176"
fa-long-arrow-left "\f177"
fa-long-arrow-right "\f178"
fa-apple "\f179"
fa-windows "\f17a"
fa-android "\f17b"
fa-linux "\f17c"
fa-dribbble "\f17d"
fa-skype "\f17e"
fa-foursquare "\f180"
fa-trello "\f181"
fa-female "\f182"
fa-male "\f183"
fa-gittip "\f184"
fa-sun-o "\f185"
fa-moon-o "\f186"
fa-archive "\f187"
fa-bug "\f188"
fa-vk "\f189"
fa-weibo "\f18a"
fa-renren "\f18b"
fa-pagelines "\f18c"
fa-stack-exchange "\f18d"
fa-arrow-circle-o-right "\f18e"
fa-arrow-circle-o-left "\f190"
fa-caret-square-o-left "\f191"
fa-dot-circle-o "\f192"
fa-wheelchair "\f193"
fa-vimeo-square "\f194"
fa-try "\f195"
fa-plus-square-o "\f196"

Icon Theme

Diharapkan Icon Tools ini merupakan salah referensi yang baik dan benar sesuai harapan anda, bisa digunakan untuk dengan demikian informasi tersebut bisa memenuhi dan mengakhiri pencarian.