Dynamic buttons CSS3 for blogspot

Discussion in 'Blogger' started by Rivaiblog, Dec 30, 2013.

  1. Rivaiblog

    Rivaiblog Member

    Joined:
    Jun 7, 2013
    Messages:
    278
    Likes Received:
    1
    Trophy Points:
    18
    Install code CSS Dynamic buttons CSS3

    Demo Dynamic buttons CSS3

    1. Login ke dashboard blog anda
    2. Masuk ke "TEMPLATE" lalu klik " Edit HTML "
    3. Cari code
      Code:
      ]]></b:skin>
      
      setelah ketemu..
    4. Copy Code script CSS Dynamic buttons CSS3 dibawah ini, pastekan tepat diatas code
      Code:
      ]]></b:skin>
      
      yang telah anda temukan tadi atau bila template blog anda memakai
      Code:
      </style>
      
      silahkan pastekan kode CSS Dynamic buttons CSS3 tepat diatas
      Code:
      </style>
      
      template anda.

    Code:
    /*****************************************
    Name : Dynamic buttons CSS3
    By : Rivai Silaban | Blog Design
    Update :Minggu 29, Desember 2013
    site : www.rivai.org
    ******************************************/
    .tombol {
    display: inline-block;
    background: url("http://2.bp.blogspot.com/-lj3rVLwKJ1g/Ur8gKU9lR5I/AAAAAAAACHY/PqO5ldPOsrc/s1600/dinamic-button.png") repeat-x 0px 0px;
    padding:5px 10px 6px 10px;
    font-weight:bold;
    text-shadow: 1px 1px 1px rgba(255,255,255,0.5);
    border:1px solid rgba(0,0,0,0.4);
    }
    .tombol:hover {
    text-shadow: 1px 1px 1px rgba(0,0,0,0.5);
    cursor:pointer;
    }
    /* warna tombol */
    .warna-biru{background-color: #CCCCCC; color: #141414;}
    .warna-biru:hover{background-color: #00c0ff; color: #ffffff;}
    .warna-hijau{background-color: #CCCCCC; color: #141414;}
    .warna-hijau:hover{background-color: #006600; color: #ffffff;}
    .warna-merah{background-color: #CCCCCC; color: #141414;}
    .warna-merah:hover{background-color: #800000; color: #ffffff;}
    /*** www.rivai.org CSS and ***/
    

    Setelah anda selesai memasang CSS Dynamic buttons CSS3 ini seperti yang telah diutarakan diatas , saatnya anda memanggil codenya untuk di tampilkan di browser dengan code yang ada dibawah ini, untuk pemasangannya itu tergantung kebutuhan anda, anda bisa saja memasangnya di mana saja.....

    Code:
    
    <p><strong> Demo dynamic buttons CSS3</strong></p>
    <div class="tombol warna-merah">click here !</div>
    <div class="tombol warna-hijau">Readmore</div>
    <div class="tombol warna-biru ">Dynamic Buttons CSS3</div>
    
    <p>Ukuran font 12px:</p>
    <div style="font-size: 12px;">
    <div class="tombol warna-merah">click here !</div>
    <div class="tombol warna-hijau">Readmore</div>
    <div class="tombol warna-biru ">Dynamic Buttons CSS3</div>
    </div>
    
    <p>Ukuran font 10px:</p>
    <div style="font-size: 10px;">
    <div class="tombol warna-merah">click here !</div>
    <div class="tombol warna-hijau">Readmore</div>
    <div class="tombol warna-biru ">Dynamic Buttons CSS3</div>
    </div>
    
    

    Untuk lebih jelasnya anda dapat melihatnya pada halaman sumber artikel berikut, semoga bermanfaat
    Sumber : http://www.rivai.org/2013/12/dynamic-buttons-css3.html
     
  2. Arul

    Arul Member

    Joined:
    Jul 10, 2013
    Messages:
    305
    Likes Received:
    19
    Trophy Points:
    18
    Google+:
    Jadinya Keren

    Jadinya Keren *bagus*
     
  3. Rivaiblog

    Rivaiblog Member

    Joined:
    Jun 7, 2013
    Messages:
    278
    Likes Received:
    1
    Trophy Points:
    18
    Arul wrote:

    thx atas pendapatnya gan..
    salam selamat menjelang Tahun Baru 2014
     

Share This Page