„Was bedeutet Schriftfamilie-Apple-System?'-CSS-Tutorial-php.cn

„Was bedeutet Schriftfamilie-Apple-System?'

WBOY

Freigeben： 2023-08-23 10:49:02

nach vorne

1147 Leute haben es durchsucht

In CSS wird die Eigenschaft „font-family“ verwendet, um die Schriftart des Textinhalts eines HTML-Elements festzulegen. Es akzeptiert mehrere Schriftartnamen als Werte. Wenn der Browser die erste Schriftart nicht unterstützt, legt er den nächsten Schriftartstil für das HTML-Element fest.

Benutzer können die CSS-Eigenschaft „font-family“ gemäß der folgenden Syntax verwenden.

font-family: value1, value2, value3, ...

Nach dem Login kopieren

Der „-apple-system“-Wert der CSS-Eigenschaft „font-family“ ermöglicht es Entwicklern, für den HTML-Inhalt der Webseite dieselbe Schriftart wie das Apple-Betriebssystem festzulegen. Das bedeutet, dass wir Schriftarten basierend auf den Gerätepräferenzen des Benutzers festlegen können.

Grammatik

Benutzer können die Schriftart „-apple-system“ als CSS-Eigenschaft „font-family“ gemäß der folgenden Syntax verwenden.

font-family: -apple-system;

Nach dem Login kopieren

Beispiel 1

Im folgenden Beispiel legen wir die Schriftfamilie „-apple-system“ für den Textinhalt des HTML-Elements fest. Wenn Sie ein Apple-Gerät verwenden, können Sie beobachten, dass die Schriftart auf die gleichen Spezifikationen wie bei Ihrem Apple-Gerät eingestellt wird.

<html>
<head>
   <style>
      .text {
         font-size: 1.6rem;
         font-family: -apple-system;
         color: blue;
      }
   </style>
</head>
<body>
   <h2>Using the <i> -apple-system </i> fonts to set the font according to apple device's font</h2>
   <p class = "text"> Welcome to the TutorialsPoint! </p>
</body>
</html>

Nach dem Login kopieren

Die chinesische Übersetzung von

Beispiel 2

lautet:

Beispiel 2

Im folgenden Beispiel fügen wir „BlinkMacSystemFont“ als zweiten Wert der Eigenschaft „Schriftfamilie“ zu den Alternativen hinzu. Hier wird für die Browser Firefox und Opera der Wert „-apple-system“ verwendet, während der Chrome-Browser „BlinkMacSystemFont“ unterstützt. Zusätzlich haben wir einige andere Schriftarten als alternative Werte verwendet. „Schriftfamilie“ wählt also die nächste Schriftart aus, bis eine gefunden wird, die vom jeweiligen Browser unterstützt wird.

<html>
<head>
   <style>
      .text {
         font-size: 1.6rem;
         font-family: -apple-system, BlinkMacSystemFont, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
         color: green;
      }
   </style>
</head>
<body>
   <h2>Using the <i> -apple-system </i> fonts to set the font according to apple device's font</h2>
   <p class = "text"> Hey! How are you? </p>
</body>
</html>

Nach dem Login kopieren

Benutzer haben gelernt, die Schriftartenfamilie „-apple-system“ zu verwenden, um Schriftarten für Apple-Geräte auszuwählen, um Schriftarten basierend auf den Geräteeinstellungen des Benutzers auszuwählen. Darüber hinaus richten wir Fallback-Schriftarten ein, falls der Browser die Schriftarten des Geräts nicht finden kann.

Das obige ist der detaillierte Inhalt von„Was bedeutet Schriftfamilie-Apple-System?'. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!