Membuat Link Mengeluarkan Efek Shadow/Bayangan

Cara Memberi Efek hover Sahdow Pada Link dan Gambar

Nah kalau tutorial yang ini, efek bayangannya yang dihasilkan akan berbeda, 

1.Silahkan langsung menuju ke :

   Blogger » Rancangan » Edit HTML » Centang Expand Widget

Tips : Untuk menjaga erorr kode HTML, Backup dulu dah template sobat ya???

2.Cari kode mirip seperti dibawah ini :

a:hover {
  color:#80ff00;
  text-decoration:none;
}

3.Ganti kode tersebut menjadi kode dibawah ini

a:hover {color:#ffffff;text-shadow: 0 0 0.5em #ff00e4,0 0 0.5em #ff00e4;text-decoration:none; -webkit-transition:all .2s ease-out; -moz-transition:all .2s ease-out; -o-transition:all .2s ease-out}

4.Kemudian Simpan dan liat hasilnya.

Keterangan : 

Bila sobat pengen efek shadow/bayangan yang dihasilkan menjadi lebih tebal, maka tambahkan lebih banyak kode  0 0 0.5em #ff00e4 Hasil Efek bayangannya yang dikeluarkan akan semakin tebal.

Contohnya seperti ini :

a:hover{color:#ffffff;text-shadow: 0 0 0.5em #ff00e4,0 0 0.5em #ff00e4,0 0 0.5em #ff00e4,0 0 0.5em #ff00e4;text-decoration:none; -webkit-transition:all .2s ease-out; -moz-transition:all .2s ease-out; -o-transition:all .2s ease-out}

Jangan lupa menbahkankan tanda 'KOMA' pada setiap kode yang ditambahkan ya???

Ket : text yang berwarna Merah = warna bayangan, silahkan ganti sesuka anda..

Semoga Tutorial ini Berguna buat sobat blogger semuanya.

Kritik dan saran sagat saya perlukan, silahkan isi komentar di bawah sob

Posted in: tutorial blog