Cara Membuat Blockquote keren v.2 di blog

Assalamualaikum wr.wb. Kali ini saya akan posting tentang Cara Membuat Blockquote keren v.2. postingan ini merupakan kelanjutan postingan tentang cara membuat blockquote keren di blog  .Keduanya memiliki kode yang hampir sama perbedaan yang paling mencolok adalah pada saat efek hover dan perubahan warna teks ,Secara keseluruhan ini adalah perbedaan cara membuat blockquote keren di blog  dengan Cara Membuat Blockquote keren v.2 :
1.pada blockquote v.1 blockquote menggunakan efek hover sehingga jika anda mengscroll mouse ke bagian blockquote maka warnya akan berubah,sedangkan di v.2 ini tidak menggunakan efek hover
2.efekbox shadow yang lebih ditonjolkan daripada v.1 dengan menggunakan efek biru bercahaya(bisa           diganti sesuai keinginan anda )
3.perubahan  warna teks,jika warna blockquote hitam(artikel tidak bi block ) maka warna teks menjadi putih sedangkan jika warna backgroundnya putih(artikel di block) maka warna teks berubah menjadi hitam

Sebagai contoh anda bisa klik gambar di bawah ini

jika anda ingin memasangnya pastikan anda sudah menghapus kode css dari blockquote v.1

• 1.buka blogger
• 2.buka template lalu html
• 3. cari kode ]]></b:skin> menggunakan CTRL + F
• 4.copy kode dibawah ini taruh diatas kode ]]></b:skin>

 .post blockquote
    {
    font-size: 15px;font-family: georgia;font-weight: normal;
    background-color: #000000;
    color: #FFFFFF;
    margin: 5px 10px;
    padding: 20px 20px 20px 20px;
    border: 2px dotted lightgrey;
    border-radius: 10px;
    box-shadow: -1px -1px 12px 4px blue;
    transition: background-color .777s;
    -webkit-transition: background-color .777s;
    -moz-transition: background-color .777s;
    -o-transition: background-color .777s;
    -ms-transition: background-color .777s;
    }
    .post blockquote:active
    {
    background-color: white ;
    color: #000;
    }
    .post blockquote { background: black; background-position:; background-repeat:repeat-y; margin: 0 20px; padding: 20px 20px 10px 45px; font-size: 0.9em; font: italic 1.2em Georgia, "Times New Roman", Times, serif; } .post blockquote p { margin: 0; padding-top: 10px; }

• 5.ubah kode background-color: white ; menjadi warna kesukaan anda(gunakan bahasa inggris)/kode warna yang anda inginkan dan untuk menggati teksnya ubah color: #000
• 6.untuk mengganti kotak bayangan ubahlah kode box-shadow: -1px -1px 12px 4px blue;
• 7.jika anda ingin menambahkan efek hover anda sisipkan kode ini diatas .post blockquote:active

.post blockquote:hover

{

background-color: darkgreen ;

color: #fff;
}

• 8.simpan

untuk penggunaannya anda tinggal menambahkan kode ini di bagian html(bukan compose)
<blockquote> teks anda </blockquote>

jika ada yang ingin agan tanyakan  silahkan berkomentar/mengcontact saya di fb yang bisa anda lihat urlnya di bagian contact us.assalamualaikum wr.wb.