Universeller Schriftcode des WeChat-Applets

Das Folgende ist ein einfaches Beispiel für einen universellen Schriftartencode für das WeChat-Applet:

// 在app.wxss中设置全局字体样式
@import './styles/fonts.wxss';

// 在fonts.wxss中定义字体样式
@font-face {
  font-family: 'CustomFont';
  src: url('font.ttf') format('truetype');
}

// 在page.wxss中使用自定义字体样式
.custom-text {
  font-family: 'CustomFont', sans-serif;
  font-size: 16px;
  font-weight: 400;
}

Im obigen Codebeispiel haben wir zunächst eine Datei namens „fonts.wxss“ in „app.wxss“ importiert, die zum Definieren der auf allen Seiten zu verwendenden Schriftarten verwendet wird. In „fonts.wxss“ verwenden wir @font-faceRegeln, um benutzerdefinierte Schriftartdateien (z. B. „font.ttf“) einzuführen und sie als zu deklarieren CustomFont.

Dann können wir in page.wxss einen benutzerdefinierten Schriftstil verwenden, bei Bedarf Klassen hinzufügen .custom-textund ihn font-familyauf den von uns definierten Schriftnamen festlegen, sodass der Text auf der Seite den von uns definierten Schriftstil anwendet.

Bitte beachten Sie, dass das obige Codebeispiel font.ttfein relativer Pfad zur Schriftartdatei ist. Stellen Sie sicher, dass die Schriftartdateien am richtigen Speicherort abgelegt und korrekt referenziert werden.