Regeln CSS3 @ font-face
Beispiele
Geben Sie eine Schriftart mit dem Namen "myFirstFont", und angeben, wo seine URL zu finden:
{
font-family: myFirstFont;
src: url ( 'Sansation_Light.ttf'),
url ( 'Sansation_Light.eot'); / * IE9 * /
}
Versuchen »
Browser-Unterstützung
Internet Explorer 9, Firefox, Opera, Chrome und Safari support @ font-face-Regel.
Allerdings unterstützt Internet Explorer 9 nur .eot Arten von Schriften, Firefox, Chrome, Safari und Opera unterstützen .ttf und OTF zwei Arten von Schriften.
Hinweis: Internet Explorer 8 und frühere Versionen von IE nicht @ font-face - Regel unterstützen.
Attributdefinitionen und Anweisungen
@ Font-face-Regel, Web-Designer müssen nicht mehr ein "web-safe" Schriftarten verwenden.
Name der Schriftart, Schrift - face-Regeln:
- font-family: myFirstFont;
Font-Dateien auf dem Server enthalten ist irgendwo, Referenz CSS:
- src: url ( 'Sansation_Light.ttf')
Wenn die Font-Datei in einem anderen Ort ist, verwenden Sie die vollständige URL:
- src: url ( '../../ www.w3cschool.css / CSS3 / Sansation_Light.ttf')
Ist nun bereit, die Schriftart zu verwenden, ist das folgende Beispiel zeigt, wie es zu benutzen alle das div-Element:
{
font-family: myFirstFont;
}
Syntax:
- @ Font-face
{
font-Eigenschaften
}
Die folgenden Beispiele von Schriften in einem div verwendet:
{
font-family: myFirstFont;
}
Grammatik
{
font-Eigenschaften
}
| Font Beschreibung | Wert | Erklärung |
|---|---|---|
| font-family | Name | Erforderlich. Legen Sie die Schriftnamen. |
| src | URL | Erforderlich. Legen Sie die Schrift Download-URL (S) |
| font-stretch | normal kondensiert Ultra kondensiert extra kondensiert semi-kondensierte ergänzt semi-expandierte extra erweitert Ultra erweitert | Optional. Definieren Sie, wie die Schrift sollte gestreckt werden. Der Standardwert ist "normal" |
| font-style | normal kursiv schräg | Optional. Legen Sie die Schriftstil sollte sein wie. Der Standardwert ist "normal" |
| font-weight | normal fett 100 200 300 400 500 600 700 800 900 | Optional. Eine benutzerdefinierte Schriftstärke. Der Standardwert ist "normal" |
| Unicode-Bereich | Unicode-Bereich | Optional. Der Bereich wird definiert Schriftarten Unicode-Zeichen unterstützen. Der Standardwert ist "u + 0-10 FFFF" |
In Verbindung stehende Artikel
CSS3 Tutorial: CSS3 Fonts