Memasang Dropcap Pada Postingan

Penggunaan Drop Cap atau Huruf besar di awal sebuah artikel atau tulisan sering digunakan untuk mempercantik atau memperindah tulisan kita. Beberapa waktu yang lalu aku sempat melihatnya di sebuah postingan sebuah blog, dan seperti biasa aku cari bagaimana caranya, dan setelah menemukan aku postingin deh caranya buat temen-temen, jadi siapa aja yang berkunjung di blogku ini yang pengen juga pasang dropcap di postingan di blognya bisa ngikutin cara-cara yang aku berikan. Oke, berikut cara-caranya :

• Seperti biasa login ke blog anda, lalu di dashboard pilih template, terus pilih edit html

• Copy code di bawah ini dan tempatkan diantara
  

/* dropcap code
----------------------------------------------- */
.dc {
float:left;
color: black;
font-size:50px;
line-height:30px;
padding-right:5px;
font-family:"arial";
}

• Untuk blog-ku kode tersebut aku tempatkan sebelum #comments
• Saat Posting, pilih Edit Html, lalu di awal postingan ketik <span class="dc">Huruf awal postingan</span>
• Kamu bisa ganti color:black dengan warna lain, misalnya red, blue, green disesuaikan dengan background blog kamu, untuk alternatif warna bisa dilihat di sini untuk blogku aku memakai kode firebrick.
• Untuk font-family juga bisa diganti dengan font pilihan lain, misalnya : verdana, comic sans,dll

Alternatif lain untuk dropcap adalah dengan menggunakan border, seperti contoh pada gambar di bawah :
Kodenya adalah :

.dc {
float:left;
color: #810541;
font-size:45px;
font-family:"verdana";
line-height:30px;
padding:5px;
margin-right:5px;
border: #810541 solid 1px;
background-color:#F9B7FF;
}

Seperti contoh sebelumnya, font-family bisa diganti dengan font lain, begitu pula dengan color, bisa menggunakan kode warna atau nama dari warna contoh : black, blue, red, dll untuk border dan background color, kode saya dapatkan di sini tinggal copy kodenya.

Atau kita bisa menggunakan background yang gelap, yang berarti dropcap dibuat dengan warna terang seperti contoh dibawah :

Kode yang saya pakai :

.dc {
float:left;
color:white;
font-size:50px;
font-family:"century gothic";
line-height:30px;
padding:5px;
margin-right:5px;
border:#CCCCCC solid 1px;
background-color:#461B7E;
}

Ingat, kombinasi warna yang digunakan, jangan sampai membuat dropcap dengan backround dan warna huruf yang kurang kontras, sehingga malah membuat drop-cap menjadi tidak jelas. Untuk Mudahnya tanpa harus melihat html code untuk warna, color : white ; border :#CCCCCC ;
background-color:#000000
Oke, selamat mencoba, semoga bermanfaat !