CARA BUAT TOMBOL DEMO WITH EFEK

Hai sobat, ane hadir lagi di kehidupan sobat. Kali ini akan membahas cara membuat tombol demo with efek, tombol demo ini berbeda dengan tombol demonya Kang Ismet, tombol ini ada efeknya hehehe. Langsung aja yuk..........

1. Buka blogger.com
2. Pilih menu Template terus ke edit HTML
3. Copy CSS dibawah ini, dan taruh diatas ]]></b:skin>

/* Button */
.buttonx{
display:inline-flex;
cursor:pointer;
font-size:13px;
font-weight:bold;
text-transform:uppercase;
color:#FFF!important;
background-color:#292929!important;
background:0;
margin:5px 0;
padding:8px 25px;
text-shadow:none;
transition:all 1s;
}
.buttonx:hover, .buttonx:hover, .buttonx.link:hover {
background:#07ACEC!important;
box-shadow: 0px 0px 18px 18px rgba(80, 80, 80, 0);
}
.buttonx:active, .buttonx:active, .buttonx.link:active {
background-color:#69b646;
box-shadow: 0 -2px #5da13f;
padding:6px 18px 12px !important;
position:relative;
top:1px
}

4. Lalu klik simpan template

Untuk Penggunaan

1. Saat sobat memposting, pilih tab HTML jangan compose

2. Lalu copy code dibawah, dan taruh di tab HTML tadi

<div style="text-align: center;">
<a class="buttonx" href="URL sobat" target="_blank">Demo</a></div>

• Demo

Ganti tulisan "URL sobat" dengan link sobat

Sumber code: blanter-forever.blogspot.com

Subscribe to receive free email updates: