Friday, September 14, 2012

Red Button CSS #1 untuk Blogazine


Cara Membuat Tombol Download dari CSS #1 - Red Button CSS#1 untuk Blogazine - Hallo semuanya apa kabar nih?, di sharing kali ini fahmi mau share beberapa hasil karya ciptaan fahmi sendiri yang didorong oleh beberapa teman-teman blogger, kali ini fahmi Mau bikin Tombol Download dari CSS #1 - Red Button CSS#1 Blogazine, "#1" artinya masih versi pertama, nanti fahmi akan buat versi-versi atau part-part lainnya. Langsung saja deh ke tutorial dibawah ini :
  1. Copy Code dibawah ini dan taruh di atas ]]></b:skin>
  2. .tombol_mengkilat{
    font-family:Arial Black;
    font-size:25px;
    background-image: linear-gradient(bottom, rgb(211,7,29) 6%, rgb(254,33,56) 53%);
    background-image: -o-linear-gradient(bottom, rgb(211,7,29) 6%, rgb(254,33,56) 53%);
    background-image: -moz-linear-gradient(bottom, rgb(211,7,29) 6%, rgb(254,33,56) 53%);
    background-image: -webkit-linear-gradient(bottom, rgb(211,7,29) 6%, rgb(254,33,56) 53%);
    background-image: -ms-linear-gradient(bottom, rgb(211,7,29) 6%, rgb(254,33,56) 53%);
    width:250px;
    height:auto;
    padding:5px;
    text-align:center;
    border-radius:5px;
    border:solid 2px #ddd;
    }
    .tombol_mengkilat a{
    color:#fff;
    text-decoration:none;
    }
    .tombol_mengkilat:hover{
    box-shadow:0 1px 5px #000;
    background-image: linear-gradient(top, rgb(211,7,29) 6%, rgb(254,33,56) 53%);
    background-image: -o-linear-gradient(top, rgb(211,7,29) 6%, rgb(254,33,56) 53%);
    background-image: -moz-linear-gradient(top, rgb(211,7,29) 6%, rgb(254,33,56) 53%);
    background-image: -webkit-linear-gradient(top, rgb(211,7,29) 6%, rgb(254,33,56) 53%);
    background-image: -ms-linear-gradient(top, rgb(211,7,29) 6%, rgb(254,33,56) 53%);
    }
    .tombol_mengkilat:active{
    background:rgb(211,7,29);
    border:solid 1px #888;
    text-shadow:1px 1px 1px #000;
    box-shadow:inset 0 0 5px #000;
    position:relative;
    top:2px;
    }
  3. Kalau sudah simpan template saja dulu, nah berikut ini adalah code pemanggilan css tersebut
    <div class='tombol_mengkilat'>Download</div>
  4. Kalian bisa mengganti tulisan "Download" dengan tulisan lain.
  5. Selamat berkarya, salam bloggers
  6. Untuk Demo silahkan Klik Disini
Demikianlah sedikit ulasan saya yang mengenai Cara Membuat Tombol Download dari CSS #1 - Red Button CSS#1 untuk Blogazine, semoga dapat berguna dan bermanfaat.

0 comments:

Post a Comment