Heim
Web-Frontend
CSS-Tutorial
Wie kann ich Google Web Fonts ohne HTML Access in mein CSS importieren?



Wie kann ich Google Web Fonts ohne HTML Access in mein CSS importieren?
Google Web Fonts in CSS-Dateien ohne HTML-Zugriff importieren
Wenn Sie mit einem CMS arbeiten, bei dem Sie eingeschränkten Zugriff auf das HTML-Dokument haben, ist dies der Fall Es kann schwierig sein, Google Web-Schriftarten zu importieren. Allerdings gibt es in CSS eine Methode, mit der Sie dies erreichen können:
@import-Methode:
Verwenden Sie die @import-Direktive wie folgt:
@import url('https://fonts.googleapis.com/css?family=Open+Sans&display=swap');
Nach dem Login kopieren
Ersetzen Sie „Open Sans“ durch den Namen Ihrer gewünschten Schriftart. URL-kodieren Sie alle Leerzeichen im Schriftartnamen, indem Sie zwischen jedem Wort ein „ “-Zeichen einfügen.
Zusätzliche Überlegungen:
- Platzieren Sie die @import-Direktive an der Stelle Ganz am Anfang Ihrer CSS-Datei, vor allen Regeln.
- Verwenden Sie URL-Kodierung für Schriftarten mit mehreren Wörter.
- Stellen Sie sicher, dass die Schriftart bei Google Fonts verfügbar ist.
Google Fonts-Anpassung:
Google Fonts bietet eine automatische Option zur Generierung die @import-Anweisung für Sie:
- Wählen Sie Ihre gewünschte Schriftart aus.
- Klicken das Symbol „ “ neben dem Namen der Schriftart.
- Erweitern Sie den Container „1 Familie ausgewählt“.
- Wählen Sie Anpassungsoptionen auf der Registerkarte „Anpassen“.
- Wechseln Sie zu Klicken Sie auf die Registerkarte „Einbetten“ und klicken Sie auf „@import“.
- Kopieren Sie das CSS innerhalb des