Cara Membuat Blockquote Hover

haii sobat suara info semua, sore hari ini aku ingin berbagi tips nii gimana cara membuat Blockquote Hover...nah untuk itu ikutin langkah-langkahnya dibawah ini...
sebelum itu aku himbau buat para sobat semua untuk meninggalkan comment nya agar kami bisa tau kelemahan dan kelebihan dalam situs kami ini....
sebelumnya aku ucapkan terima kasih karena telah mengikuti perkembangan blog ini...kami akan berusaha memberikan yang terbaik buat sobat-sobat semua.....:))

Cara membuat Blockquote Hover :

• Loogin blog
• Rancangan, edit HTML, cari kode  ]]></b:skin>
• Dan simpan kode beikut diatasnya :

blockquote {
         padding: 10px; height: auto;
         margin: 10px 0 10px 20px;
         background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzkg3is7a9tWOSyu_RBOZj79kve8qapPtrh_RDbTxn_NIKkfVxgW3808K6exEO8sZdLvl64MCmFG7pXSSi4PkjeQEBAZtbAlYlq0TeAOQFTGMkyLdf00f1VJxxw_SiJRstuUx-YBSaEo0V/s1600/papers.jpg);
         font: 13px/17px Serif, Times, Helvetica;
         font-style: italic;
         color: #FFCC99;
         text-shadow: 1px 1px 1px #000;
         border: 1px ridge  #0099FF;
         border-radius: 20px 10px 20px 10px;
        -moz-border-radius: 20px 10px 20px 10px;
        -webkit-border-radius: 20px 10px 20px 10px;
        -o-transition: all 1.2s ease-in;
        -moz-transition: all 1.2s ease-in;
        -webkit-transition: all 1.2s ease-in;
}
blockquote:hover {
         color: #eee;
        -o-transform: rotate(0deg) scale(1.06) translate(-10px, 0);
        -moz-transform: rotate(0deg) scale(1.06) translate(-10px, 0);
        -webkit-transform: rotate(0deg) scale(1.06) translate(-10px, 0);}
blockquote span.bbuka, blockquote span.btutup {
         float: left;
         margin-right: 5px;
         height: 17px;
         width: 22px;
         background: url(http://i964.photobucket.com/albums/ae124/gubhugreyot/Blockquote-L.png) left top no-repeat;
        -o-transition: all 1.2s ease-in;
        -moz-transition: all 1.2s ease-in;
        -webkit-transition: all 1.2s ease-in;
}
blockquote span.bbtutup {
         float: right;
         margin-left: 5px;
         margin-right: 0;
         background: url(http://i964.photobucket.com/albums/ae124/gubhugreyot/Blockquote-R.png) right top no-repeat;
}
blockquote:hover span.bbuka, blockquote:hover span.btutup {
        -o-transform: rotate(1090deg) scale(1.1);
        -moz-transform: rotate(1090deg) scale(1.1);
        -webkit-transform: rotate(1090deg) scale(1.1);
}

Untuk memanggilnya, simpan kode berikut pada edit HTML sobat :

<blockquote><span class="opening"></span>Masukkan teks disini<span class="closing"></span></blockquote>

Semoga artikel diatas bermanfaat buat para teman-teman semua...

untuk melihat demonya disini