Wird die Zeilenhöhe von der ersten Schriftart in einem CSS-Fontstack bestimmt?

9

Ich frage das, denn wenn ich versuche, einen CSS-Font-Stack für mehrsprachige Inhalte wie Englisch und Chinesisch zu erstellen, wird das finale Rendering von der ersten Schriftart im Stapel beeinflusst (normalerweise lateinische, da die meisten chinesischen Schriften kommen) mit lateinischer Unterstützung).

Siehe zum Beispiel diesen Codepen .

%Vor%

Was ich sehe:

Da chinesische Glyphen nur in Hiragino Sans GB erscheinen, erwarte ich, dass alle chinesischen Blöcke die gleiche Zeilenhöhe haben. Sie sind jedoch anscheinend davon betroffen, dass die Schriftart Avenir Next oben im Stapel hinzugefügt wird.

Da sowohl Firefox als auch Chrome auf OSX mein Beispiel gleich darstellen, frage ich mich, ob die CSS-Spezifikation etwas dazu sagt. CSS 2.1-Schriftarten scheint nicht anzugeben, was mit der Zeilenhöhe geschehen soll, wenn Sie auf fehlende Zeichen zurückgreifen .

Aktualisiert Safari rendert anders, aber leider ist der Unterschied auf overflow: hidden , nicht auf Glyph Fallback zurückzuführen. Mein aktualisiertes Beispiel zeigt dies möglicherweise etwas deutlicher.

Bei Chrome und Firefox

Auf Safari

Und wenn Sie wirklich mit Schriftarten in Verbindung stehen, versuchen Sie dieses Beispiel , das verschiedene Font-Stacks zeigt, und sehen Sie, wie sie sich in jedem Browser unterscheiden.

    
bitinn 09.03.2015, 16:47
quelle

1 Antwort

3

Das kommt ziemlich auf die Benutzeragenten an. Jedes Mal, wenn die CSS-Spezifikation sagt, "nicht durch diese Spezifikation definiert", das ist der Code für "lassen wir Browser tun, was sie für das Beste halten und dann versuchen, sie alle konsequent zu verhalten, nach ein paar Jahren, es anders zu machen".

Darüber hinaus steht das neueste CSS Inline Layout Modul ganz oben in Abschnitt 1 (Zeilenhöhen und Baseline-Ausrichtung) :

  

Dieser Abschnitt wird umgeschrieben. Siehe Abschnitt 10.8 von [CSS21] für die normative CSS-Definition oder den 2002 Working Draft, wenn Sie schöne Bilder wünschen. (Aber den alten Text ignorieren, die Hälfte ist falsch. Wir geben nicht an, welche Hälfte, das ist zu bestimmen.)

Das ist vom letzten Monat. Also, weißt du, viel Glück und Godspeed, im Grunde.

Interessanterweise sehe ich ein anderes Ergebnis in Safari 6.2.2 als Sie gepostet haben:

Wenn es einen Unterschied zwischen diesem und dem neuesten Safari gibt, können Sie möglicherweise einen Bugfix zwischen den beiden Versionen aufspüren, der erklärt, warum er sich geändert hat.

    
Eric A. Meyer 10.03.2015, 18:50
quelle

Tags und Links