Langsung ke konten utama

Postingan

Menampilkan postingan dengan label CSS

Cara Membuat Menu Slide CSS3 Animated

Assalamuakum Wr Wb -  Setelah Kemaren saya share " cara membuat efeck post Hover dengan menggunakan CSS " Dan Kali Ini saya akan Kembali share Post Tentang CSS lagi :D Langsung Saja Ke TKP Tapi Sebelumnya Silakan Lihat Demo-Nya Terlebih dahulu :D DEMO Masuk Blogger » Rancangan » Edit HTML Copy CSS di bawah Ini dan Letakan Di atas Code ]]></b:skin>  <style> ul.svertical{ width: 200 px; /* width of menu */ overflow: auto; background: black ; /* background of menu */ margin: 0; padding: 0; padding-top: 7px; /* top padding */ list-style-type: none; } ul.svertical li{ text-align: right; /* right align menu links */ } ul.svertical li a{ position: relative; display: inline-block; text-indent: 5px; overflow: hidden; background: rgb(127, 201, 68); /* initial background color of links */ font: bold 16px Germand; text-decoration: none; padding: 5px; margin-bottom: 7px; /* spacing between links */ color: black; -moz-box-shado...

Cara Membut Efek Post Hover Dengan Menggunakan CSS

Assalamualakum Wr Wb - Setelah Kemaren saya sudah share Artikel " 7 Kata-kata Tentang Cinta " Dan Sekarang saya akan sesuai Dengan Judul Yitu Cara Membut Efek Post Hover Dengan Menggunakan CSS, :D Tentu Sobat Semua sudah tau apa itu hover ? oh ada yang tidak tau. Hover adalah efek yang diterima suatu objek saat di sentuh mouse/kursor, misalnya ketika link saat di sentuh mouse. Nah kalau post itu ada bagian posting, muali dari background, tulisan, semuanya tentang posting deh. Sekarang kita akan mencoba menggabungkan hover dan post dengan CSS, Langsung saja Ke TKP :D. Login Ke Blogger >> Rancangan >> Edit HTML Cari Code </head> Copy Code Di bawah Ini dan Letakan Di Atas Code </head> <b:if cond='data:blog.homepageUrl == data:blog.url'> <style>     .hentry:hover {      background:#ddd -moz-linear-gradient(top,  #ddd,  # 80FFFE );background :- webkit-gradient(linear, left      top, left botto...

Cara Membuat Animasi CSS3 pada gambar

Assalamualakum Wr Wb - Setelah lama saya tidak Post Artikel Tengan Untuk Mempercantik Blog saya kali ini akan share Animasi CSS3 :D Dan Berikut Ini CSS3 yang sedikit saya dapatkan :) tapi hasilnya Memuaskan :) Image Hover CSS3 Coba Sorot Mouse ke dalam Gambar di bawah ini :) Silakan Copy Paste Code Di bawah Ini <style type="text/css">.kodokloncat{float:center; margin:0px; autowidth:0px; autoheight:0px; autoborder:none; overflow:hidden}.details{width:200px; height:300px; background:#000; color:#fff; text-align:center} #kodok-3{position:relative;}#kodok-3 img{opacity:1-webkit-transition: opacity;-webkit-transition-timing-function: ease-out;-webkit-transition-duration: 500ms;}#kodok-3 .details{position:absolute;top:0;left:0;opacity: 0;-webkit-transition: opacity;-webkit-transition-timing-function: ease-out;-webkit-transition-duration: 500ms;}#kodok-3 .details:hover{opacity: .9;-webkit-transition: opacity;-webkit-transition-timing-function: ease-out;-webkit-trans...

Cara Membuat Efek Bintang Berpijar Di blog

Asslamualkum Wr Wb - Setelah Dua Hari tidak post arikel apapun di karenakan lagi sibuk HOKI ninja saga Berjudi token :D, setelah kemaren saya sudah share " Selamat Datang David Beckham di Indonesia " Dan " Cara Membuat Efek Neon light text di blog " Dan yang terakhir adalah " Cheat TP and Feather (PERMANENT) ". Dan kali ini saya akan share sputar Trick N' tips blogger :D yaitu "Cara membuat Efek Bintang berpijar di blog" Caranya mudah dan simpel sob tinggal menambahkan sedikit ramuan, langsung saja ke TKP. Masuk keblogger >> Rancangan >> Edit HTML kemudian cari tulisan  a:hover {  dan tambahkan code dibawah ini background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjB1tM4oYWDHV4kpZzfu3CfIckvP0LrrlQT4YdNRqcDb16eVCE0ZgNHapnYSCWJtHDYFgYI0bk0NRSRorMKKAM46Pcs8zZXe9imfQDQTDNIhU2abLTrZVJwTILOUbWS2ipnX6rabFCiPY7z/s1600/stars.gif); sehingga susunannya menjadi seperti ini  a:hover { background-image: ...

Cara Membuat Efek Neon light text di blog

Assalamualakum Wr wb - Setelaha kemaren saya post Cheat Ninja saga Yaitu " Cheat TP and Feather (PERMANENT) " Dan " Kumpulan Kata-Kata Gombal " Dan Saya bertrimah kasih banyak Sama Dode  Karena telah membantu saya di blog ini. Dan kali ini saya akan post " Cara membuat Efek neon light text di blog " kalian Pasti uda pada ngerti Dengan ini yaitu Text yang ada Seperti Lampu yang terang dan bisa berjalan, langsung saja ke TKP. <h2><script language="JavaScript1.2"> //Neon Lights Text II by G.P.F. (gpf@beta-cc.de) //visit http://www.beta-cc.de //Visit http://www.dynamicdrive.com for this script var message="Thank you for visiting Dynamic Drive!" var neonbasecolor="gray" var neontextcolor="yellow" var neontextcolor2="#FFFFA8" var flashspeed=100 // speed of flashing in milliseconds var flashingletters=3 // number of letters flashing in neontextcolor var flashingletters2=1 // num...