Fon CSS3
Peraturan CSS3 @font-face
Dalam versi CSS3 terdahulu, pereka web terpaksa menggunakan fon yang telah dipasang pada komputer pengguna.
Dengan CSS3, pereka web boleh menggunakan mana-mana fon yang dia suka.
Apabila anda menemui fail fon yang ingin anda gunakan, cuma masukkan fail fon pada tapak web anda dan ia akan dimuat turun secara automatik kepada pengguna yang memerlukannya.
Fon yang anda pilih diterangkan dalam versi CSS3 baharu dengan peraturan @font-face.
Fon "sendiri" anda ditakrifkan dalam peraturan CSS3 @font-face.
Gunakan fon yang anda perlukan
dalam @font- baharu peraturan muka, anda mesti terlebih dahulu menentukan nama fon (seperti myFirstFont) dan kemudian tuding pada fail fon.
Petua: Sila gunakan fon huruf kecil untuk URL huruf besar akan menghasilkan hasil yang tidak dijangka dalam IE
Jika anda perlu menggunakan fon untuk elemen HTML, sila hantar keluarga fon. atribut untuk merujuk nama fon (myFirstFont):
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
<style>
@font-face
{
font-family: myFirstFont;
src: url('Sansation_Light.ttf')
,url('Sansation_Light.eot'); /* IE9 */
}
div
{
font-family:myFirstFont;
}
</style>
</head>
<body>
<p><b>注意:</b> Internet Explorer 9 只支持 .eot 格式的字体.</p>
<div>
使用CSS3,网站终于可以使用字体以外的预先选择“合法”字体
</div>
</body>
</html>Gunakan teks tebal
Anda mesti menambah satu lagi peraturan @font-face yang mengandungi teks tebal:
rreeeThe fail "Sansation_Bold.ttf" ialah fail fon lain yang mengandungi teks tebal fon Sansation.
Pelayar yang menggunakan keluarga fon "myFirstFont" untuk teks ini harus menjadikannya tebal.
Dengan cara ini anda boleh mempunyai banyak peraturan @font-face untuk fon yang sama.
Penerangan fon CSS3
Jadual berikut menyenaraikan semua penerangan fon dan takrifan peraturan @font-face di dalam:
| 描述符 | 值 | 描述 |
|---|---|---|
| font-family | name | 必需。规定字体的名称。 |
| src | URL | 必需。定义字体文件的 URL。 |
| font-stretch |
| 可选。定义如何拉伸字体。默认是 "normal"。 |
| font-style |
| 可选。定义字体的样式。默认是 "normal"。 |
| font-weight |
| 可选。定义字体的粗细。默认是 "normal"。 |
| unicode-range | unicode-range | 可选。定义字体支持的 UNICODE 字符范围。默认是 "U+0-10FFFF"。 |
