Un seul caractère affecte-t-il la hauteur de ligne dans différents navigateurs ?

La hauteur de ligne peut-elle être affectée par un caractère spécifique

Cet article examine si un caractère de texte spécifique peut modifier la hauteur de ligne lors du rendu, un comportement remarqué dans Firefox pour Windows 10.

L'extrait de code fourni montre deux paragraphes avec un caractère de soulignement ASCII ajouté dans une instance. Dans Firefox, le trait de soulignement entraîne une diminution de la hauteur de la ligne et coupe le caractère, alors que d'autres navigateurs ne présentent pas ce comportement.

La question se pose de savoir quel comportement est correct. line-height: 1 implique généralement la possibilité d'insérer n'importe quel texte dans une ligne de cette taille. Cependant, la conception des personnages peut présenter des défis spécifiques.

Comportement correct

Tous les comportements observés sont considérés comme corrects en raison de la variation des polices par défaut selon les navigateurs et les systèmes d'exploitation.

Hauteur de ligne et conception des personnages

La hauteur de ligne affecte la taille de la zone de ligne, mais elle ne contrôle pas directement le rendu des caractères. Les caractères sont définis par la zone de contenu de la police, qui n'est pas influencée par la hauteur de ligne.

Hauteur de ligne : 1 ne garantit pas qu'un caractère tiendra dans la hauteur spécifiée, car la police peut ne pas avoir conçu sa caractères pour tenir dans cet espace.

Exemple

L'extrait de code suivant démontre la distinction entre la ligne boîte et zone de contenu. À mesure que la hauteur de la ligne change, la taille du fond rouge de l'élément span (représentant la zone de ligne) varie, tandis que le texte (représentant la zone de contenu) reste inchangé :

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!