So stellen Sie die Schriftglättung in CSS ein

In CSS können Sie das Attribut „-webkit-font-smoothing“ verwenden, um die Schriftartglättung festzulegen. Die Syntax lautet „-webkit-font-smoothing:subpixel-antialiased“; dieses Attribut kann die Schriftarten auf der Seite anti- aliased, was klarer und komfortabler aussehen wird.

Die Betriebsumgebung dieses Tutorials: Windows7-System, CSS3- und HTML5-Version, Dell G3-Computer.

Beim Stöbern im offiziellen Drupal-Theme habe ich einen interessanten, nicht standardmäßigen CSS-Selektor entdeckt-webkit-font-smoothing, also habe ich angefangen, damit herumzuspielen. So verwenden Sie CSS3-Schriftarten für eine reibungslose Anzeige

Sie müssen wissen, dass W3C über Anti-Aliasing-Rendering von Schriftarten in CSS nachgedacht hat, z. B. „font-smooth“, dies kann jedoch auf Unterschiede bei der Darstellung von Schriftarten in verschiedenen Betriebssystemen und Browsern zurückzuführen sein Kurz gesagt, er wurde nicht in einen Webstandard aufgenommen. WebKit verfügt jedoch weiterhin über eine Reihe eigener, nicht standardmäßiger Selektoren, um Anti-Aliasing-Effekte zu unterstützen und die Anzeige von Schriftarten flüssiger zu gestalten.

-webkit-font-smoothing hat hauptsächlich die folgenden drei Attribute:

• none: Kein Anti-Aliasing

• subpixel-antialiased (Standard): Subpixel-Glättung ist in Mac OS und MacType für Windows üblich

• Antialiasing: Graustufenglättung wird häufig auf Mobilgeräten wie Android und iOS verwendet. Nachdem ich es ausprobiert habe, kann ich mit meinen hölzernen Augen jedoch keinen Unterschied zwischen den beiden letzteren erkennen. Und dieses nicht standardmäßige CSS gilt nur für die meisten mobilen Browser und Desktop-Browser mit WebKit-Kern wie Safari und Chrome. Was die IE-Serie betrifft, Sie unterstützen sie nicht selbst, geben Sie mir die Schuld ~

Schauen wir uns hier zunächst den tatsächlichen Effekt an. Zuerst wird es ohne Anti-Aliasing gerendert:

Der nächste Schritt ist die Verwendung -webkit-font-smoothing: subpixel-antialiased Der Effekt nach der Glättung durch Anti-Aliasing-Rendering:

Es ist ersichtlich, dass die Glätte der Kanten der Schriftart immer noch unterschiedlich ist und nach dem Hinzufügen viel besser aussieht .

Nach dem Test haben wir festgestellt, dass Schriftarten-Anti-Aliasing im Allgemeinen in den integrierten Grundeigenschaften von Browsern enthalten ist. Aber um auf der sicheren Seite zu sein, fügen wir es manuell hinzu. ~

Empfohlenes Lernen:

CSS-Video-Tutorial

Das obige ist der detaillierte Inhalt vonSo stellen Sie die Schriftglättung in CSS ein. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!