Wie führe ich externe CSS-Schriftarten ein? Einführung in die Einführung externer CSS-Schriftarten

Manchmal brauchen wir eine gut aussehende Schriftart auf einer Website. Schließlich lässt eine gut aussehende Schriftart die gesamte Seite für Benutzer schöner und attraktiver aussehen Schriftart, aber der heutige Artikel dient nicht dazu, Sie in die Verwendung von Bildern zum Erstellen einer gut aussehenden Schriftart einzuführen, sondern in die Methode zum Einführen externer Schriftarten in CSS einzuführen.

Kommen wir ohne Umschweife gleich zur Sache~

Was wir bei der Einführung externer CSS-Schriftarten verwenden müssen, ist das @font-face von CSS3. Was ist @font-? Gesicht? Schauen wir uns unten an

@font-face ist ein Modul in CSS3. Es bettet hauptsächlich selbstdefinierte Web-Schriftarten in Ihre Webseiten ein.

Werfen wir zunächst einen Blick auf die Syntaxregeln von @font-face:

@font-face {
      font-family: <YourWebFontName>;
      src: <source> [<format>][,<source> [<format>]]*;
      [font-weight: <weight>];
      [font-style: <style>];
    }

font-family: Benutzerdefinierter Schriftartname (im Allgemeinen auf den Namen der importierten Schriftart festgelegt), und die Schriftart wird in nachfolgenden Stilregeln mit diesem Namen referenziert.

src : Legen Sie den Ladepfad und das Format der Schriftart fest, trennen Sie mehrere Ladepfade und Formate durch Kommas

Hinweis: Es gibt auch einen lokalen Namen (Schriftartname) danach das src-Attribut Feld, das angibt, dass die Schriftart vom Benutzersystem geladen wird und die Webfont erst nach einem Fehler geladen wird.

src: local(font name), url("font_name.ttf")

srouce : Der Ladepfad der Schriftart, der eine absolute oder relative URL sein kann.

Format : Das Format der Schriftart, das hauptsächlich für die Browsererkennung verwendet wird, umfasst im Allgemeinen die folgenden Typen: TrueType, OpenType, TrueType-Aat, Embedded-OpenType, Avg usw.

Schriftstärke und Schriftstil sind die gleichen wie zuvor.

Dann werfen wir einen Blick auf die Implementierungsmethode der

Einführung externer CSS-Schriftarten:

Der erste Schritt besteht darin, die Schriftart in CSS einzuführen und ihr einen passenden Namen zu geben. Wie folgt:

Laden Sie zuerst die Schriftart herunter und legen Sie sie im Schriftartenverzeichnis ab

font.css:

@font-face {
 font-family: 'fontnameRegular';
 src: url('fontname.eot');
 src: local('fontname Regular'),
        local('fontname'),
        url('fontname.woff') format('woff'),
        url('fontname.ttf') format('truetype'),
        url('fontname.svg#fontname') format('svg');
}

Hinweis:

fontname steht für den Namen der Schriftartdatei Der Name von

, zum Beispiel Ihre Schriftartdatei ist php.ttf, dann müssen alle oben genannten Schriftartnamen in php geändert werden.

font-family definiert den Namen der Schriftart und den nächsten src dient zum Laden der Schriftartdatei. Der Grund dafür, dass es mehrere URLs gibt, sind Probleme mit der Browserkompatibilität.

Der zweite Schritt besteht darin, die soeben definierte Schriftart wie folgt zu verwenden

h1{font-family: fontnameRegular}

Dieser Artikel endet hier. Weitere spannende Inhalte finden Sie in den relevanten Tutorialspalten des PHP-Chinesisch Webseite! ! !

Das obige ist der detaillierte Inhalt vonWie führe ich externe CSS-Schriftarten ein? Einführung in die Einführung externer CSS-Schriftarten. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!