de.hideout-lastation.com
Erstellen Sie Ihre eigene Schriftart Icon Set leicht mit Fontello
Wir können sehen, dass Font Icons weit verbreitet auf Websites verwendet werden, und das aus gutem Grund. Das Font Icon ist zuverlässig, sieht auf dem High-DPI-Bildschirm klar und scharf aus und lässt sich durch CSS leicht in Bezug auf die Symbolgröße, Farbe und Symbolposition anpassen. Dies macht es einfach, Zeichensymbole mit CSS3 Transforms und Transitions zu animieren.
Es gibt eine große Anzahl von Font-Icon-Sets zur sofortigen Verwendung, die jedoch nicht immer alle Ihre Bedürfnisse abdecken. Vielleicht möchten Sie Ihre Icons anpassen können . In diesem Fall ist es vielleicht besser, dass Sie ein eigenes Icon-Set erstellen.
Mit all den Tools, die wir jetzt haben, ist das Erstellen eines eigenen Font Icon- Sets nicht mehr so schwierig wie früher. In diesem Post wird Ihnen gezeigt, wie Sie das leicht machen können. Lass es uns überprüfen.
Vorbereiten der Symbole
Zuerst müssen wir die Icons vorbereiten. Die Symbole müssen in Vektorform sein. Wenn Sie mit Vektoranwendungen wie Adobe Illustrator, Inkscape und CorelDraw vertraut sind, können Sie eigene Symbole erstellen. Stellen Sie sicher, dass die Symbole einheitliche Eigenschaften beibehalten, und exportieren Sie sie anschließend im SVG-Format .
Alternativ können Sie auch SVG-Symbole sammeln, die online kostenlos zur Verfügung stehen.
In diesem Beispiel verwenden wir die SVG-Symbole von Ionicons. Ionicons hat eigentlich sein eigenes Font-Icon, aber in diesem Beispiel werden wir nur ein paar extrahieren, um zu erklären, wie man sein eigenes Icon-Set erstellt.
Hier ist, was ich ausgesucht habe:
Einige dieser Symbole bestehen aus mehreren Formen. Bevor wir sie also als Font-Icon aufstellen können, müssen wir die Shapes in einem Compound zusammenführen. Öffnen Sie dazu die .svg in Illustrator. Wählen Sie alle Formen und gehen Sie zu: Objekt > Compound Path > Make .
Mach das auch mit den anderen Icons.
Schrift erstellen
Fontello macht die Erstellung von Font Icon einfach. Neben dem Abrufen von Symbolen aus beliebten Font-Icon-Sets können wir mit Fontello auch externe Icons hochladen. Ziehen Sie einfach alle ausgewählten Symbole per Drag & Drop auf Fontello . Sobald sie hochgeladen sind, wird sie im Abschnitt Benutzerdefinierte Symbole angezeigt.
Sie können auf das Stiftsymbol klicken, um die Eigenschaften des Symbols, nämlich den CSS-Namen und den Hex-Code, zu bearbeiten.
Wählen Sie Ihre benutzerdefinierten Symbole, legen Sie den Namen Ihrer Schriftart fest und klicken Sie auf die Schaltfläche Download.
Fontello wird alle notwendigen Schriftarten generieren: .svg, .eot, .ttf und .woff . und die Stylesheets plus die Demo.
Das ist es. Das Erstellen von Schriften war noch nie so einfach. Ich hoffe, Sie finden diesen Tipp hilfreich.
Wie man WordPress Aktions-Hooks in der Theme-Anpassung verwendet
WordPress-Unterthemen bieten eine relativ einfache Möglichkeit, das Aussehen eines Themas anzupassen. Wenn die Optionen des Designs Ihnen keine geeigneten Designoptionen bieten, können Sie der Standard-Stylesheet-Datei style.css eine neue Regel hinzufügen. Was passiert aber, wenn Sie auch die Funktionalität des Themas ändern möchten? Das
20 herausragende architektonische Entwürfe aus aller Welt
Wie bei allen anderen Arten von Designarbeiten ist das Erstellen guter Hausdesigns keine leichte Aufgabe. Glücklicherweise werden uns dank der vielen talentierten Architekten auf der ganzen Welt nicht neue, beeindruckende architektonische Entwürfe ausgehen. Außerdem verfügen wir heute über alle modernen Technologien. Es
