Herunterladen einer Google-Schriftart und Einrichten einer Offline-Site, die diese Schriftart verwendet

Ich habe eine Vorlage, die einen Verweis auf eine Google-Schriftart wie diese enthält:

<link href='http://fonts.googleapis.com/css?family=Open+Sans:400italic,600italic,400,600,300' rel='stylesheet' type='text/css'>

Wie kann ich sie herunterladen und für die Verwendung auf meinen Seiten einrichten, die ständig offline laufen?

unor
Bearbeitete Frage 21. Mai 2018 в 1:03
Programmierung
fonts offline css google-fonts
10. April 2013 в 3:22
6 Aufrufe

In diesem praktischen Artikel wird erklärt, wie Sie Google-Schriftarten offline verwenden können.

Im Grunde genommen binden Sie die Schriftart in Ihr Projekt ein.

@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: normal;
src: url('path/to/OpenSans.eot');
src: local('Open Sans'), local('OpenSans'), url('path/to/OpenSans.ttf') format('truetype');
davidb
Bearbeitete Antwort 10. April 2013 в 3:50
Kommentare (1)

Wenn Sie Google Fonts verwenden, ist Ihr Arbeitsablauf in 3 Schritte unterteilt: "Auswählen", "Anpassen", "Einbetten". Wenn Sie genau hinsehen, finden Sie am rechten Ende der Seite "Verwenden" einen kleinen Pfeil, mit dem Sie die Schriftart herunterladen können, die sich derzeit in Ihrer Sammlung befindet.

Sobald die Schriftart auf Ihrem System installiert ist, müssen Sie sie nur noch wie jede andere normale Schriftart mit der CSS-Direktive font-family verwenden.

KyleMit
Bearbeitete Antwort 25. November 2018 в 2:52
Kommentare (0)

Sie müssen die Schriftart herunterladen und sie lokal referenzieren.

Laden Sie die "CSS" von dem Link herunter, den Sie gepostet haben, dann laden Sie alle "WOFF"-Dateien herunter und konvertieren Sie sie (falls erforderlich) in "TTF".

Dann ändern Sie das "CSS" aus dem Link, den Sie gepostet haben, um die Schriftarten lokal einzubinden.

Von

url(http://themes.googleusercontent.com/static/fonts/opensans/v6/
DXI1ORHCpsQm3Vp6mXoaTXhCUOGz7vYGh680lGh-uXM.woff)

Nach

url(/path/to/font/font.woff)

Voila! Möglicherweise müssen Sie noch mehr tun, aber das oben Genannte ist die Grundlage. 1eser Artikel1 erklärt es noch ein wenig besser.

Kommentare (3)