Heim > Web-Frontend > Layui-Tutorial > So fügen Sie ein Symbol in Laui hinzu

So fügen Sie ein Symbol in Laui hinzu

藏色散人
Freigeben: 2020-11-13 10:28:36
Original
6556 Leute haben es durchsucht

So fügen Sie Symbole in Laui hinzu: Öffnen Sie zuerst die offizielle Website von Iconfont und wählen Sie die gewünschte Schriftart-Symbolbibliothek aus. Klicken Sie dann im Projekt auf „In lokal herunterladen“ und kopieren Sie die dekomprimierte Datei schließlich in das lokale Projekt in das lokale Projekt. Nur Code.

So fügen Sie ein Symbol in Laui hinzu

Empfohlen: „layUI Tutorial

layui2.0 und frühere Versions-Schriftsymbole können die Anforderungen des Projekts nicht erfüllen. Die Symbole stammen von Alibaba www.iconfont.cn, daher habe ich die Projektschriftarten manuell angereichert . Symbolbibliothek, wie folgt aufgezeichnet.

1. Schriftartensymbole zum Warenkorb hinzufügen

Öffnen Sie www.iconfont.cn, wählen Sie die gewünschte Schriftartensymbolbibliothek aus und fügen Sie sie der „Bibliothek“ (d. h. dem Schriftarten-Einkaufswagensymbol) hinzu, wie in der Abbildung gezeigt Bild unten So fügen Sie ein Symbol in Laui hinzu

2, Fügen Sie das Symbol zum Projekt hinzu

Klicken Sie rechts auf das „Warenkorbsymbol“ und fügen Sie dann das ausgewählte Schriftartsymbol zum Projekt hinzu. Es wird empfohlen, ein neues Projekt zu erstellen, um zukünftige Erweiterungen zu erleichtern.

3. Laden Sie den Code herunter und führen Sie ihn ein

Klicken Sie im Projekt auf „Auf lokal herunterladen“, kopieren Sie dann die dekomprimierte Datei in das lokale Projekt und importieren Sie die Datei iconfont.css lokal.

4. Wählen Sie das Schriftartensymbol

und öffnen Sie die Datei demo_unicode.html. Folgen Sie den Dateianweisungen und geben Sie den relevanten HTML-Code in das lokale Projekt ein.
Zum Beispiel 3

Wenn es Laui ist, können Sie für einen schönen Stil den geänderten CSS-Code von iconfont.css wie folgt ändern:

.iconfont{font-family:"iconfont" !important;
font-style:normal;
-webkit-font-smoothing: antialiased;
display: inline-block;
-webkit-text-stroke-width: 0.2px;
font-size:14px;
transition: all 0.4s linear 0s;-o-transition: all 0.2s linear 0s;-moz-transition: all 0.2s linear 0s;
}
Nach dem Login kopieren

5 Wenn Sie müssen in Zukunft Schriftartensymbole hinzufügen. Wiederholen Sie dies in den obigen Schritten. Laden Sie den Projektcode direkt von Alibaba iconfont in Ihre lokale Umgebung herunter, überschreiben Sie den vorherigen Code (außer iconfont.css) und Sie können das neue Schriftartensymbol verwenden.

Das obige ist der detaillierte Inhalt vonSo fügen Sie ein Symbol in Laui hinzu. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage