Heim >Web-Frontend >HTML-Tutorial >So konvertieren Sie kleine SVG-Bilder in HTML-Schriftdiagramme

So konvertieren Sie kleine SVG-Bilder in HTML-Schriftdiagramme

高洛峰
高洛峰Original
2017-02-17 13:29:121722Durchsuche

Selbst erstellter einfacher Anwendungsfall für Schriftartendiagramme: Demo ansehen

Produktionsschritte:

1: Melden Sie sich auf der Online-Website des Produktionstools an

https://icomoon .io/

2: Der rote 如何把SVG小图片转换为  html字体图表

-Button in der oberen rechten Ecke geht zu: https://icomoon.io/app/#/select

3: Klicken Sie auf die obere linke Ecke: Importsymbole

如何把SVG小图片转换为  html字体图表

, um Ihr eigenes SVG-Bild zu importieren, das dann auf die Online-Website hochgeladen wird

4: Klicken Sie, um das gerade hochgeladene Diagramm auszuwählen. Das kleine Diagramm sieht wie folgt aus:

如何把SVG小图片转换为  html字体图表

5: Klicken Sie nach der Auswahl auf 如何把SVG小图片转换为  html字体图表

Schaltfläche in der unteren rechten Ecke, um das Schriftartendiagramm automatisch zu generieren

如何把SVG小图片转换为  html字体图表

Sie können die entsprechenden Schriftarten und CSS einführen, um die durch das Element angegebene Klasse wie folgt zu verwenden. . Ist es nicht erstaunlich?~

如何把SVG小图片转换为  html字体图表

6: Das 如何把SVG小图片转换为  html字体图表 in der oberen linken Ecke ist die Grundeinstellung zum Generieren des Schriftartendiagramms. Nach der Einstellung können Sie auf klicken

Download-Schaltfläche zum Herunterladen der gerade erstellten Schriftartentabelle. Nach der Dekomprimierung sind die entsprechenden Schriftarten und CSS-Dateien für die Verwendung vorhanden. 如何把SVG小图片转换为  html字体图表

Auf diese Weise können Sie die Größe und Farbe der Schriftart flexibel ändern, was weitaus bequemer ist, als Bilder direkt zu verwenden!

Weitere verwandte Artikel zum Konvertieren kleiner SVG-Bilder in HTML-Schriftdiagramme finden Sie auf der chinesischen PHP-Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn