Membuat Blockquote lebih Keren

Disetiap template yang kita pakai di blog, dipastikan sudah terdapat Blockquote. Tapi, ada beberapa mungkin tidak sesuai dengan harapan kita. Entah tampilannya kurang menarik ataupun warna yang jijay banget. Nah, disini saya ingin berbagi sebuah CSS yang berfungsi untuk merombak Blockquote diblog sobat, tampilannya kurang lebih seperti yang saya pakai. Contohnya seperti ini :
Dimohon dengsan sangat, jika berkenan sobat bisa mendukung blog ini dalam kontes  ArenaBetting.com dukung fair play FIFA world cup AFSEL 2010 hanya dengan memasang sebuah kode berikut dihalaman blog sobat. Dan saya doakan selamat dunia akhirat dan diberi kemudahan aliran dollarnya oleh Sang Maha Kuasa. :D
<strong><a href="http://www.vanmovic.co.cc/2010/05/arenabettingcom-dukung-fair-play-fifa.html" title="ArenaBetting.com dukung fair play FIFA world cup AFSEL 2010" target="_blank">ArenaBetting.com dukung fair play FIFA world cup AFSEL 2010</a></strong>
Nah, blockquote seperti diataslah yang saya pakai. Dan jika sobat tertarik memasangnya diblog, bisa mengikuti beberapa langkah tutorial dibawah ini. Sebelum melangkah lebih jauh, arti blockquote sendiri adalah  sebuah kotak area yang diciptakan dengan tag <blockquote> dan ditutup dengan tag </blockquote>. Fungsi dari blockquote sendiri adalah untuk memberi kesan penegasan terhadap kutipan, jika kita mengutip dari postingan lain orang lain dalam tulisan kita. Dan bisa juga memperindah  tampilan postingan kita di blog. 
Oke, untuk langkah awal merombak blockquote seperti yang saya gunakan bisa ikuti langkah dibawah ini :
1. Setelah sobat login ke blogger, bisa langsung tuju ke Edit HTML.
2. Jangan lupa cek kotak Expandnya.
3. Carilah kode ]]></b:skin>, kemudian letakkan kode CSS ini diatasnya :

.post blockquote {
background:#f5f8fa url(http://eosmate.googlepages.com/blockquoteku2.png) no-repeat scroll 0 0;
border-color: #D7E8F0;
border-style: solid;
border-width: 1px 1px 1px 20px;
color: #004276;
font-family: Consolas, "Courier New", Courier, mono, serif;
font-size: 13px;
line-height: 16px;
margin:10px 0 10px 10px;
overflow: visible;
padding: 28px 10px 10px;
width:80%; }
.post blockquote:hover {
background:#FFFFFF url(http://eosmate.googlepages.com/blockquoteku2.png) no-repeat scroll 0 0
}
.post blockquote p {
margin:.75em 5;
background:url(http://i37.tinypic.com/211qd03.jpg) no-repeat;
padding:20px;
background-position:bottom right;
}
Bila mungkin kurang berkenan, sobat bisa utak-atik sendiri kode diatas dengan kreasi sobat tentunya. Itulah sedikit sajian penghujung malam dari saya. Semoga dapat bermanfaat.