Membuat Warna Background "Block Quote" Berubah saat Disorot Mouse

Sesuai judul kali ini Saya akan memberikan tutorial Membuat Warna Background "Block Quote" Berubah saat Disorot Mouse, artinya jika anda memberikan "Quote" pada sebuah teks, maka saat pengunjung menyorot mousenya ke teks tersebut yang terjadi adalah warna background asli akan berubah menjadi warna yang kita inginkan. Contoh seperti quota teks di bawah ini:

SOROT SAYA PAK!....

Untuk membuatnya ikuti langkah berikut:
1. Login ke Blogger
2. Edit HTML >> Centang Expand Template Widget
3. Cari: blockquote
4. Tidak semua blockquote sama persis, contoh di Blog Saya seperti ini:

blockquote{margin:20px;padding:10px;color:#666;width:537px;height:auto; overflow:auto;border:1px solid #E0E0E0; border-radius:5px;background:#F9F9F9;}

5. Kemudian Copy kode blockquote anda, Paste kan di bawahnya dan tambahkan beberapa kode berwarna merah seperti contoh di bawah ini. Jangan lupa kode untuk warna juga diganti agar berpengaruh saat mouse di sorot.

blockquote:hover{margin:20px;padding:10px;color:#666;width:537px; height:auto; overflow:auto;border:1px solid #A2A2A2; border-radius:5px;background:#E0E0E0;text-decoration:none;}

6. Maka hasilnya akan seperti ini:

blockquote{margin:20px;padding:10px;color:#666;width:537px;height:auto; overflow:auto;border:1px solid #E0E0E0; border-radius:5px;background:#F9F9F9;}
blockquote:hover{margin:20px;padding:10px;color:#666;width:537px; height:auto; overflow:auto;border:1px solid #A2A2A2; border-radius:5px;background:#E0E0E0;text-decoration:none;}

7. Save template, selesai.

Note: Inti dari tutorial ini adalah kita hanya membuat Copy-an BlockQuote kita kemudian menambahkan kode yang berwarna merah dan mengganti kode yang berwarna biru sesuai keinginan kita.
Jika ada yang kurang jelas silahkan komentar.