Deaktivierung von Schriftligaturen CSS (Buchstabenkombination)

Question

Moderne Browser kombinieren automatisch einige Buchstaben, am häufigsten 'f' und 'i' mit einem einzelnen Zeichen, das als Ligatur bezeichnet wird. Dies optimiert oft die Lesbarkeit (d. H. Einfacher zu lesen), jedoch ist dies manchmal nicht das, was ein Designer wünscht.

Persönlich hatte ich dieses Problem nur in Chrome (Version 53.0.2785.101), ich, obwohl ich nicht sicher sein kann, glaube ich, dass dieses Problem in allen anderen Versionen von Chrome besteht.

Chrome f und i mehrfach kombiniert

Rand

IE11

In diesem Fall war ich auf der Suche nach einer Möglichkeit, es auszuschalten.

Answer 1

Wie sich herausstellt, ist es definitiv möglich, es brauchte nur etwas zu graben. Wie auf MDN, you can turn off common ligatures erwähnt:

font-feature-settings: "liga" 0; 

Dies wird jedoch durch die Verwendung einer obskure CSS-Eigenschaft getan. Stattdessen sollten Sie font-variant-ligatures verwenden, etwa so:

font-variant-ligatures: none; 

Diese beiden Eigenschaften macht genau das gleiche, jedoch ist die letztere eine zu empfehlen.

MDN:

Hinweis: Wann immer möglich, Web-Autoren sollten die font-variant Stenografie Eigenschaft oder eine bezügliche Langschrift Eigenschaft font-variant-Ligatur, font-variant-Kappen, font-variant-Ost -asian, Schriftart-Variante-wechselt, Schriftart-Variante-numerische oder Schriftart-Variante-Position.

Diese Eigenschaft ist eine Low-Level-Funktion, die für spezielle Fälle entwickelt wurde, in denen keine andere Möglichkeit zum Aktivieren oder Zugreifen auf eine OpenType-Schriftart verfügbar ist.

Insbesondere sollte diese CSS-Eigenschaft nicht zum Aktivieren von Kapitälchen verwendet werden.