for headings and

for paragraphs." onmouseover="this.style.backgroundColor='#ebeff9'" onmouseout="this.style.backgroundColor='#fff'">Selalu gunakan tag HTML yang tepat, seperti

-

untuk judul dan

untuk paragraf.

Nilai font-size dapat berupa absolut, atau relatif ukuran.

Absolute Ukuran:

* Mengatur teks ke ukuran tertentu
* Apakah tidak memungkinkan pengguna untuk mengubah ukuran teks dalam semua browser (buruk karena alasan aksesibilitas)
* Ukuran Mutlak berguna ketika ukuran fisik dari output diketahui

Relatif ukuran:

* Mengatur ukuran relatif terhadap elemen sekitarnya
* Memungkinkan pengguna untuk mengubah ukuran teks dalam browser

Catatan Jika Anda tidak menetapkan ukuran font, ukuran standar untuk teks biasa, seperti paragraf, adalah 16px (16px = 1em).
Mengatur Ukuran Font Dengan Pixel

Mengatur ukuran teks dengan piksel, memberi Anda kendali penuh atas ukuran teks:
Contoh
h1 (font-size: 40px;)
h2 (font-size: 30px;)
p (font-size: 14px;)

Coba sendiri »

Contoh di atas memungkinkan Firefox, Chrome, dan Safari untuk mengubah ukuran teks, tapi tidak Internet Explorer.

teks tersebut dapat diubah ukurannya di semua browser menggunakan zoom tool (Namun, ini mengubah ukuran seluruh halaman, tidak hanya teks).
Mengatur Ukuran Font Dengan Em

Untuk menghindari masalah ukuran dengan Internet Explorer, banyak pengembang menggunakan em daripada piksel.

Unit ukuran em direkomendasikan oleh W3C.

1em sama dengan ukuran font saat ini. Ukuran teks default di browser adalah 16px. Jadi, ukuran default 1em adalah 16px.

Ukuran dapat dihitung dari piksel untuk mereka dengan menggunakan rumus ini: pixels/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 * /

Coba sendiri »

Dalam contoh di atas, ukuran teks dalam mereka adalah sama dengan contoh sebelumnya dalam pixel. Namun, dengan ukuran mereka, adalah mungkin untuk menyesuaikan ukuran teks dalam semua browser.

Sayangnya, masih ada masalah dengan IE. Ketika mengubah ukuran teks, menjadi lebih besar dari seharusnya jika dibuat lebih besar, dan lebih kecil dari yang seharusnya bila dibuat lebih kecil.
Gunakan Kombinasi Persen dan Em

Solusi yang bekerja di semua browser, adalah untuk menetapkan ukuran font default-dalam persen untuk elemen body:
Contoh
body (font-size: 100%;)
h1 (font-size: 2.5em;)
h2 (font-size: 1.875em;)
p (font-size: 0.875em;)

Coba sendiri »

Kode kita sekarang karya-karya besar! Ini menunjukkan ukuran teks yang sama di semua browser, dan memungkinkan semua browser untuk memperbesar atau mengubah ukuran teks!

Contoh lainnya

Set the boldness of the font
Contoh ini menunjukkan bagaimana untuk mengatur keberanian font.

Set the variant of the font
Contoh ini menunjukkan bagaimana untuk mengatur varian dari font.

All the font properties in one declaration
Contoh ini menunjukkan bagaimana menggunakan properti singkat untuk setting semua properti font dalam satu deklarasi.
Semua Properti Font CSS

Jumlah pada kolom "" mengindikasikan di mana CSS CSS versi properti didefinisikan (CSS1 atau CSS2).

Property	Description	Values	CSS
font	Sets all the font properties in one declaration	font-style font-variant font-weight font-size/line-height font-family caption icon menu message-box small-caption status-bar inherit	1
font-family	Specifies the font family for text	family-name generic-family inherit	1
font-size	Specifies the font size of text	xx-small x-small small medium large x-large xx-large smaller larger length % inherit	1
font-style	Specifies the font style for text	normal italic oblique inherit	1
font-variant	Specifies whether or not a text should be displayed in a small-caps font	normal small-caps inherit	1
font-weight	Specifies the weight of a font	normal bold bolder lighter 100 200 300 400 500 600 700 800 900 inherit	1