Make Button Full Style with CSS 3

Dalam dunia ini ada satu hukum mutlak berlaku, apabila kita menguasai ilmu secara profesional maka dengan mudah dapat membuat sebuah kreasi gaya punya. Singkat cerita, bila ilmu kita setinggi langit maka kita bisa dengan leluasa mau ngapain ajah dengan ilmu yang kita miliki tersebut. Untuk saat ini, Beben Koben si bloglang anu ganteng kalem tea enggak bakalan ngajak ke langit kok guna mendapatkan ilmu full stylish :D
Membuat tombol fangkeh dengan menggunakan atribut CSS 3 :)) Menggunakan gambar dalam membuat tombol juga bisa sob :) Cuman saat sekarang Koben akan berbagi membikin tombol menggunakan murni attribute CSS 3 dipadu dengan gaya penulisan Hexadecimal Entities :D

Biar cepat ngeuh, mari sama-sama kita tengok hasil jadi "some other awesome CSS3 buttons"

Actions

ButtonAddEditDeleteSaveSend email

Miscellaneous

LikeNextFavouriteSparkPlayEat Mie

Bagaimana buttonnya tuh sob, keren kan? Itu semua 100% using css3 and numeric hex entities. Keterangan detil membuat tombol diatas, sobat bisa kunjungi web cool satu ini :P

View Article View demo
Andai sobat mau menambah variabel tombol, perhatikan kode CSS di bagian

/* Hexadecimal entities for the icons */

.add:before
{
       content: "\271A";
}

.edit:before
{
       content: "\270E";
}

.delete:before
{
       content: "\2718";
}

.save:before
{
       content: "\2714";
}

.email:before
{
       content: "\2709";
}

.like:before
{
       content: "\2764";
}

.next:before
{
       content: "\279C";
}

.star:before
{
       content: "\2605";
}

.spark:before
{
       content: "\2737";
}

.play:before
{
       content: "\25B6";
}

Contoh Beben nambahin variabel tombolnya nih

CUT Hazard Phone FLY

Tinggal tambahkan kode CSS seperti diatas dengan unik ID yang berbeda saja kok!!!.cut:before {
content: "\2704";
}

.hazard:before {
content: "\2622";
}

.phone:before {
content: "\2706";
}

.fly:before {
content: "\2708";
}Untuk kode hex entities bisa dilihat di MindProd, Unicode ranges (ver. 4.0), Unicode Codepoint Chart, Unicode/UTF-8-character table atau sobat tahu web lainnya! Angka atau hurufnya saja yang dipakai didahului dengan pemakaian garing (garis miring) \ untuk mengambil hex coded.
Mau instant dapatin style button defaultnya, bisa agan coba tools berikut ini CSS3 Button Generator ;)

Others Button Resource

http://css3framework.co.uk/
http://www.paulund.co.uk/css-buttons-with-icons-but-no-images
Semoga bermanfaat :)
Happy make the button full stylish \m/