DROP CAP ANIMASI

H
uruf seperti yang ditulisakn di majalah dan surat kabar.
seperti yang terlihat pada tulisan ini .
caranya :

Find Code (Cari Kode) : Cari Kode "]]></b:skin>". Posisi kode tersebut di atas kode </head>. Gunakan "Ctrl+F" untuk mencarinya.
Copy-Paste : Copy Kode CSS di bawah kemudian Paste di atas kode "]]></b:skin>".
SAVE Template (Simpan Template) : KLIK "SAVE Template (Simpan Template)".

Kode CSS

.bgsGRhd {
float:left;
color:#0000CC;
line-height:45px;
background:url(http://i964.photobucket.com/albums/ae124/gubhugreyot/anima/LatemBleding.gif) center no-repeat;
margin:-3px 10px 0 0;
font-family:Times New Roman;
padding:3px;
-moz-border-radius:12px;
font-size:4em;
font-weight:700;
text-shadow:white 0.02em 0.02em 0.1em;
opacity:0.6;-moz-opacity:0.6;filter:alpha(opacity=60);
text-decoration:blink;
border:1px solid blue;
}
.bgsGRhd:hover{
background:url(http://i964.photobucket.com/albums/ae124/gubhugreyot/anima/BlueDog_bgDropCapHov.gif) center no-repeat;
opacity:1.0;-moz-opacity:1.0;filter:alpha(opacity=100);
}

 Cara menggunakan di posting :

<span class="bgsGRhd">H</span>uruf depan dipotong dan diletakkan diantara kode (tag) pembuka span dan tag penutupnya.
Terlihat di atas pada kata Huruf, huruf H dipisahkan dari uruf.

Ganti background dan kode CSS
Untuk membuat background pada huruf yang diperbesar tersebut, silahkan ganti URL gambarnya.
Gambar 1 : http://i964.photobucket.com/albums/ae124/gubhugreyot/anima/LatemBleding.gif
Gambar 2 : http://i964.photobucket.com/albums/ae124/gubhugreyot/anima/BlueDog_bgDropCapHov.gif.
Ukuran Gambar di max 50px (height) dan 50px (width).
text-decoration:blink; : untuk menciptakan efek berkedip.
Opacity : untuk menciptakan efek blur atau transparansi.
-min-border-radius:12px; : untuk menciptakan efek lengkung di ke-4 sisinya.
font-size : Apabila ukuran huruf diperbesar atau diperkecil, maka line-height juga harus dirubah. Sesuaikan dengan perubahan yang dilakukan pada ukuran huruf.