Fon CSS
Sifat fon CSS mentakrifkan fon, tebal, saiz dan gaya teks.
Fon CSS
Dalam CSS, terdapat dua jenis nama keluarga fon:
Keluarga fon universal - sistem fon yang berkongsi rupa yang serupa Gabungan (seperti "Serif" atau "Monospace")
Keluarga fon khusus - Keluarga fon khusus (seperti "Times" atau "Courier")
Keluarga fon
Sifat keluarga fon menetapkan keluarga fon teks.
Atribut keluarga fon harus menetapkan beberapa nama fon sebagai mekanisme "sandaran", jika penyemak imbas tidak menyokong fon pertama, dia akan mencuba fon seterusnya.
Nota: Jika nama keluarga fon adalah lebih daripada satu aksara, ia mestilah dalam tanda petikan, seperti Keluarga Fon: "宋体".
Gaya fon
digunakan terutamanya untuk menentukan atribut gaya fon teks condong.
Atribut ini mempunyai tiga nilai:
Normal - memaparkan teks secara normal
Italik - memaparkan teks dalam huruf condong
Teks senget - memaparkan teks ke sisi Italic (sangat serupa dengan italik, tetapi kurang disokong)
Saiz Fon
Sifat saiz fon menetapkan saiz teks.
Keupayaan untuk mengurus saiz teks adalah sangat penting dalam reka bentuk web. Walau bagaimanapun, anda tidak boleh melaraskan saiz fon untuk menjadikan perenggan kelihatan seperti tajuk, atau tajuk untuk kelihatan seperti perenggan.
Pastikan anda menggunakan tag HTML yang betul, untuk <h1> - <h6> untuk tajuk dan <p> untuk perenggan:
Nilai saiz fon boleh mutlak atau saiz relatif.
Saiz mutlak:
Menetapkan teks kepada saiz yang ditentukan
Tidak membenarkan pengguna menukar saiz teks dalam semua penyemak imbas
Menentukan saiz fizikal daripada output Saiz mutlak berguna apabila
Saiz relatif:
Tetapkan saiz relatif kepada elemen sekeliling
Benarkan pengguna menukar saiz teks dalam penyemak imbas
Jika Anda tidak menentukan saiz fon, dan saiz lalai adalah sama seperti perenggan teks biasa, iaitu 16 piksel (16px=1em).
Tetapkan saiz fon dalam piksel
Tetapkan saiz teks dan piksel, memberikan anda kawalan penuh ke atas saiz teks:
Gunakan em Untuk menetapkan saiz fon
Untuk mengelakkan masalah tidak dapat mengubah saiz teks dalam Internet Explorer, banyak pembangun menggunakan unit em dan bukannya piksel.
unit saiznya disyorkan oleh W3C.
1em adalah sama dengan saiz fon semasa. Saiz teks lalai dalam pelayar ialah 16px.
Oleh itu, saiz lalai 1em ialah 16px. Anda boleh menukar piksel kepada em menggunakan formula berikut: px/16=em Dalam penyelesaian, saiz fon lalai elemen <body>
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <style> h1{font-family:"微软雅黑"} p.text1{font-style:italic;} p.text2{font-size:40px;} p.text3{font-size:1.875em;} /* 30px/16=1.875em */ p.text4{font-size:0.875em;} </style> </head> <body> <h1>《七步诗》曹植</h1> <p class="text1">煮豆持做羹,</p> <p class="text2">漉豉以为汁,</p> <p class="text3">萁在釜下燃,</p> <p class="text4">豆在釜中泣,</p> <p class="text5">本自同根生,</p> <p class="text6">相煎何太急?</p> </body> </html>