Breaking News
Loading...
05 April 2013

CARA MEMBUAT CSS3 BOTTON

center>
css3 buttons

Buttons-1


buttons-2


buttons-3




buttons-4


button-5




buttons lain










Cara membuat css3 buttons
Langkah penggunaan css3 buttons
  1. Simpan kode css di atas kode ]]></b:skin> di halaman Edit HTML.
  2. Untuk sampai di halaman Edit HTML, lakukan :

    - Login ke BloGGer
    - Dasboard --> KLIK Design/Rancangan
    - Design/Rancangan --> KLIK Edit HTML
    - Cari Kode ]]></b:skin>, kemudian letakkan kode css3 buttons persis di atasnya.
    - Kode CSS juga bisa di upload di file hosting (google sites atau google code), kemudian link kode cssnya di simpan di atas kode </head> .

    Bentuk pemasangannya seperti ini :

    <link href="button-keren.css" rel="stylesheet" type="text/css" media="screen" />
    
    </head>

    - KLIK SAVE/Simpan Template.
Penggunaan kode HTML css3-buttons di halaman posting atau yang lain

xHTML :
<button class="bt1">Button text</button>

<button class="bt2">Button text</button>

<button class="bt3">Button text</button>

<button class="bt4">Button text</button>

<button class="bt5">Button text</button>

<button class="bt1">Button text</button>

Untuk model lain gunakan tambahan kode ini

xHTML :
<button class="bt1 GRbt1">Button text</button>

<button class="bt1 GRbt2">Button text</button>

<button class="bt1 GRbt3">Button text</button>

Lakukan juga untuk button 2, 3, 4 dan 5, seperti kode berikut :

xHTML :
<button class="bt2 GRbt2">Button text</button>

<button class="bt3 GRbt2">Button text</button>

<button class="bt4 GRbt2">Button text</button>

<button class="bt5 GRbt2">Button text</button>

Cara menggunakan Button CSS3 dalam sebuah link

Tambahkan tag a dengan class atau id GRbt baru kemudian tag button berada di dalamnya. Lihat contoh berikut:

<a id="GRbt" href="Your URL here" title="Your title here"><button class="bt1">Button Text</button></a>

Atau seperti ini :

<a class="GRbt" href="Your URL here" title="Your title here"><button class="bt1">Button Text</button></a>
 
SUMBER: http://gubhugreyot.blogspot.com/2010/07/css3-buttons-cara-membuat-button-keren.html

0 komentar:

Post a Comment

 
Toggle Footer