Trik Membuat Blockquote Efek Hover

Hello Sobat blogger,
Setelah sebelumnya saya sudah posting tentang Cara Membuat Blockquote Keren, udah baca belum ?kali ini saya akan posting yang update dari yang Sebelumnya, yang tentunya lebih keren.

Blockquote efek hover adalah blockquote yang apabila tersorot oleh mouse maka berubah warnanya. Penasaran....?

 Baik, tidak usah banyak omong lagi. langsung saja kita mulai Trik Membuat Blockquote Efek Hover berikut ini.
  
  Trik Membuat Blockquote Efek Hover: 

1. Pertama, Seperti biasa login dulu ke Blogger
2. Klik Template
3. Klik Edit HTML
4. Cari kode yang kurang lebih seperti berikut :

.post blockquote {
background:
url(-----------------------------;
margin:------------------------;
padding:-----------------------;
border-top:--------------------;
border-right:------------------;
border-left:-------------------;
border-bottom:-----------------;
font-size:---------------------;
 

5. Jika ada, Hapus kode tersebut.
6. Jika tidak ada, lanjut ke langkah selanjutnya. Cari kode ]]></b:skin>
7. Letakkan kode berikut di atasnya :

blockquote{
margin:20px;
padding: 15px 15px 15px 15px;
color:#666;
border-left:6px solid #c0c0c0;
border-top:1px solid #c0c0c0;
border-right:1px solid #c0c0c0;
border-bottom:1px solid #c0c0c0;
transition-duration:1s;
-webkit-transition-duration:1s;
-moz-transition-duration:1s;
}
blockquote:hover{
transition-duration:1s;
-webkit-transition-duration:1s;
-moz-transition-duration:1s;
border-radius:6px;
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-color:green;
background:#E6FFB1;
-moz-box-shadow:0px 1px 5px #000000;
-webkit-box-shadow:0px 1px 5px #000000;}

Apabila anda ingin menampilkan blockquotenya, anda harus mengklik tombol blockquote, atau bisa juga dengan menyisipkan tag berikut di postingan
<blockquote>...</blockquote>

Demikian tutorial kali ini. Semoga Bermanfaat ^_^.

Ditulis Oleh : Krisna Adji S. ~ Tutorials, Game, Blogging, Information

Sobat sedang membaca artikel tentang Trik Membuat Blockquote Efek Hover. Sobat diperbolehkan mengcopy paste atau menyebar-luaskan artikel ini, namun jangan lupa untuk meletakkan link dibawah ini sebagai sumbernya. Saling menghargai kreatifitas sobat Blogger. <a href="https://krisnaa-tkj.blogspot.com/2013/03/trik-membuat-blockquote-efek-hover.html" target="_blank">Trik Membuat Blockquote Efek Hover</a>

:: Get this widget ! ::