Popular Post

Posted by : Surya Fahik Rabu, 12 Juni 2013

Meneraplan Font Awesome Icon Di Blog
Font Awesome Icon adalah Kumpulan icon-icon yang berbasis atau terbuat dari "Font". Yang berarti Icon tersebut tidak terbuat dari "Gambar" dan pastinya akan mempercepat load blog.

Untuk menerapkannya di blog, Pertama tambahkan kode dibawah ini diatas kode <head>
<link href="//netdna.bootstrapcdn.com/font-awesome/3.1.1/css/font-awesome.css" rel="stylesheet"/>
Untuk melihat semua nama "Font" yang dapat digunakan silahkan ke sini.
Cara penggunaan-nya anda cukup menambahkan tag <i>, class dan nama "font".

Cara Penulisannya
<i class="icon-smile"></i> Cara Penulisan-nya
Ikon Kamera
<i class="icon-camera-retro"></i> Ikon Kamera

Memperbesar Ukuran Ikon
Normal
2x Lebih Besar
3x Lebih Besar
4x Lebih Besar
5x Lebih Besar
<i class="icon-smile"></i> Normal
<i class="icon-smile icon-large"></i> 2x Lebih besar
<i class="icon-smile icon-2x"></i> 3x Lebih besar
<i class="icon-smile icon-3x"></i> 4x Lebih besar
<i class="icon-smile icon-4x"></i> 5x Lebih besar

Icon-Icon tersebut juga dapat diputar, dengan menentukan derajat putaran.
  ikon normal
  ikon diputar 90 derajat
  ikon diputar 180 derajat
  ikon diputar 270 derajat
  ikon dibalik secara horizontal
  ikon dibalik secara vertikal
<i class="icon-home"></i> ikon normal
<i class="icon-home icon-rotate-90"></i> ikon diputar 90 derajat
<i class="icon-home icon-rotate-180"></i> ikon diputar 180 derajat
<i class="icon-home icon-rotate-270"></i> ikon diputar 270 derajat
<i class="icon-home icon-flip-horizontal"></i> ikon dibalik secara horizontal
<i class="icon-home icon-flip-vertical"></i> ikon dibalik secara vertikal


Icon Tersebut juga bisa anda gunakan pada tombol/button blog.
<a class="tombol" href="#"><i class="icon-comment"></i> Comment</a>
<a class="tombol" href="#"><i class="icon-info-sign"></i> Info</a>
<a class="tombol" href="#"><i class="icon-trash icon-large"></i> Delete</a>
<a class="tombol" href="#"><i class="icon-cog"></i> Settings</a>

- Copyright © 2013 Surya Log - Devil Survivor 2 - Powered by Blogger - Designed by Johanes Djogan -

About Me

Foto saya
KUPANG, NUSA TENGGARA TIMUR, Indonesia

Arsip Blog