CSS Font – Font Family
Untuk menentukan jenis font, digunakan property font-family.
Contoh
p{font-family:"Times New Roman", Times, serif;}
Font Style
Property font-style digunakan untuk mendefinisikan style pada font.
Property ini memiliki 3 value, yaitu :
- normal – Teks yang biasanya ditampikan
- italic – Teks yang ditampilkan miring
- oblique – Teks yang “condong”. (Sangat mirip dengan italic)
Contoh
p.normal {font-style:normal;}
p.italic {font-style:italic;}
p.oblique {font-style:oblique;}
Font Size
Property font-size digunakan untuk menetapkan ukuran font.
Jika Anda tidak menetapkan ukuran font, ukuran font untuk teks biasa ialah 16px (16px = 1em).
Mengatur Ukuran Font Dengan Pixel
Contoh
h1 {font-size:40px;}
h2 {font-size:30px;}
p {font-size:14px;}
Contoh diatas dapat bekerja di Internet Explorer 9, Firefox, Chrome, Opera dan Safari.
Catatan : Contoh diatas tidak bekerja di IE, kecuali versi 9 keatas.
Teks dapat dirubah ukurannya di semua browser menggunakan tool zoom.
Mengatur Ukuran Font Dengan Em
Untuk menghindari masalah ukuran font di versi lama dari Internet Explorer, banyak pegembang web menggunakan em daripada pixel. Ukuran font dengan em sangat direkomendasikan oleh W3C.
Ukuran teks standar di browser adalah 16px. Jadi ukuran default 1em adalah 16px.
Anda dapat menghitung ukuran pixel ke em dengan rumus : pixel/16 = em
Contoh
h1 {font-size:2.5em;} /* 40px/16=2.5em */
h2 {font-size:1.875em;} /* 30px/16=1.875em */
p {font-size:0.875em;} /* 14px/16=0.875em */
Contoh diatas. ukuran teks dalam em sama seperti contoh sebelumnya dalam pixel. Dengan em, memungkinkan teks untuk menyesuaikan ukurannya di semua web browser.