Materi
Properti font-family berisi daftar huruf berurutan prioritas, dipisah koma. Browser memakai huruf pertama yang tersedia. MDN meminta setiap daftar memuat paling sedikit satu nama keluarga generik, seperti sans-serif atau serif, sebagai cadangan terakhir, karena tidak ada jaminan huruf mana pun terpasang di perangkat pembaca.
Huruf yang tidak terpasang bisa diunduh lewat aturan @font-face. Di dalamnya, font-family memberi nama yang nanti kamu panggil, dan src menunjuk berkasnya. MDN menyarankan format WOFF2 untuk web karena kompresinya lebih efisien daripada format lama. Bila src memuat local() lebih dulu, salinan yang sudah terpasang dipakai tanpa mengunduh.
@font-face {
font-family: "Nusantara Sans";
src: url("/font/nusantara-sans.woff2") format("woff2");
font-display: swap;
}
body {
font-family: "Nusantara Sans", Arial, sans-serif;
line-height: 1.5;
}Selama berkas diunduh, browser memutuskan apa yang tampil lewat font-display. swap memberi masa tunggu yang sangat singkat: teks langsung tampil dengan huruf cadangan, lalu berganti begitu berkasnya siap. block menyembunyikan teks sebentar dengan huruf cadangan yang tidak terlihat. Di jaringan lambat, swap membuat teks bisa dibaca sejak awal.
line-height mengatur tinggi baris. Tulis tanpa satuan, misalnya 1.5: angka itu dikalikan ukuran huruf setiap elemen, jadi judul besar dan paragraf mendapat jarak yang sebanding. Nilai berpiksel diwariskan apa adanya ke judul besar sehingga barisnya bisa bertumpuk. MDN meminta paling sedikit 1.5 untuk paragraf utama.