Cara Membuat Sepinning Image / Gambar Berputar Dengan CSS

Halo Sobat DRobani X ini saya akan share Cara Membuat Sepinning Image / Gambar Berputar Dengan CSS Ya ok langsung aja ya sobat DRobani XD

gambar animasi sharingan xc blog

Langkah" Nya
1. Login ke Blogger
2. Pergi ke Dashbor,
3. Pergi ke Template -> Edit HTML
4. Masukan Code Dibawah ini tepat diatas code

/* DRobaniSharingan Berputar */
.DRobaniSharingan1 { -moz-animation:spin2Pulse 1s infinite linear; -webkit-animation:spin2Pulse 1s infinite linear;margin-top:-20px; margin-left:400px;position:absolute;z-index:999;height: 200px;line-height: 46px;border-radius:500px;border-left:10px solid black;border-right:10px solid black;width: 200px;; -moz-animation:DRobanispin 1s infinite linear; -webkit-animation:DRobanispin 1s infinite linear;animation:DRobanispin 1s infinite linear}
.DRobaniSharingan {margin-top:-20px; margin-left:400px;position:absolute;z-index:999;background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJMjsbAQviNfdtIroqd40U5xLSEU16oQx_6mt8wS0cuFxUktmOlGUfTDOfUPffNw2ePv9lJMJVXi4Rx1dEd67ScXPgqv4MwXaJNahFCgOpxohV9EbS0bUuWL54dnaI3hIChWKJz96WWaVF/s185/supers.png) no-repeat;height: 185px; line-height: 46px;border-left:20px solid black;border-radius:500px;border-right:20px solid black;width: 185px; -moz-animation:DRobanispin 1s infinite linear; -webkit-animation:DRobanispin 1s infinite linear;animation:DRobanispin 1s infinite linear}
@-moz-keyframes DRobanispin {0%{-moz-transform:rotate(0deg);} 100%{-moz-transform:rotate(-360deg);} }
@-webkit-keyframes XCspin {0%{-webkit-transform:rotate(0deg);} 100%{-webkit-transform:rotate(-360deg);} }
@keyframes DRobanispin {0%{-moz-transform:rotate(0deg);} 100%{-moz-transform:rotate(-360deg);} }

Pengertian Code Diatas :
Code margin-top:-20px; margin-left:400px; itu sesuaikan dengan yang kamu mau Marginnya...
Code height: 200px; yaitu Tinggi gambarnya (sesuaikan dengan keinginan tingginya )
Code width: 185px; yaitu Lebar gambarnya (sesuaikan dengan keinginan lebarnya )
Code https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJMjsbAQviNfdtIroqd40U5xLSEU16oQx_6mt8wS0cuFxUktmOlGUfTDOfUPffNw2ePv9lJMJVXi4Rx1dEd67ScXPgqv4MwXaJNahFCgOpxohV9EbS0bUuWL54dnaI3hIChWKJz96WWaVF/s185/supers.png yaitu code gambar sharingannya..
bisa diganti dengan code gambar sharingan yang lain :)

Kalau code diatas sudah dimasukin, selanjutnya cari code

Kalau sudah semuanya silahkan di "Save Template" Atau di Partinjau terlebih dahulu, :D
kalau tidak bisa, coba ulang lagi cara"nya diatas ,sampai bisa :D...
nah ada tambahan nih, untuk code gambar sharingan nya...

1. Sharingan Biasa :