Dropcaps adalah huruf besar pada awal tulisan. Biasanya digunakan pada penulisan artikel, postingan, dan sebagainya. Pada blog, dropcaps memberikan daya tarik tersendiri untuk mendapatkan banyak visitor. Hal ini dikarenakan diberikannya sedikit sentuhan CSS pada huruf tersebut. Kali ini Hasbi akan menjelaskan bagaimana cara membuat dropcaps pada awal postingan blog. Cara ini hampir sama dengan penerapan cara-cara pada postingan saya sebelumnya, yaitu
Membuat Percentage Srollbar di Blog dan
Menghilangkan Gambar Obeng dan Tang Pada Blog. Oke, tidak usah berlama-lama lagi langsung saja kita simak caranya berikut ini.
Pemasangan CSS
1. Masuk ke blog sobat
2. Klik menu Template pada sidebar kiri
3. Klik Edit HTML.
4. Cari kata
]]></b:skin> menggunakan tombol CTRL+F untuk mempermudahnya. Kemudian paste kode dibawah ini tepat diatas
]]></b:skin> .
.dropcap {
float:left;
font-family:Arial;
color:black;
background:none;
font-size:40px;
line-height:44px;
padding:0 5px 0 0;
border-radius:3px;
}
5. Klik Simpan tampilan
Penggunaan
Untuk menggunakan, klik pada menu HTML pada post editor kemudian beri kode berikut diantara huruf pertama.
<span class="dropcap">H</span>uruf besar pertama adalag dropcap.
Catatan :
- Warna hijau bisa sobat ganti dengan font lain
- Warna merah bisa diganti dengan warna lain untuk mengganti warna huruf
- Warna biru bisa diganti dengan warna lain untuk mengganti warna background
- Butuh bantuan dengan warna? kunjungi Hasbi Color Generator
