Problème d'alignement de soulignement dans les polices chinoises et anglaises sous IE
巴扎黑
Libérer: 2017-08-21 12:01:58
original
1508 Les gens l'ont consulté
Décrivez d'abord le problème : comme le montre l'image, lorsqu'une ligne de texte contient à la fois de l'anglais et du chinois sous IE, le soulignement du lien se rompt, ce qui signifie que le chinois et l'anglais ne sont pas alignés pour le moment ! (FIREFOX n'est pas concerné par ce problème)
Cependant, après tests, cette situation ne se produira pas lorsque le lien est défini directement sur la page par défaut !
Puis le doute revient, qu'est-ce qui cause l'écart entre le chinois et l'anglais ? ! Quelle est la solution ? ! Ainsi, après mes tests, j'ai trouvé deux situations (bien sûr, il peut y avoir d'autres situations provoquantes. Vous pouvez l'essayer vous-même). Les éléments adjacents des objets chinois et anglais ont le paramètre d'attribut d'alignement vertical (comme la petite image précédente, ou la zone de texte, nous devons les aligner verticalement. Généralement, lorsque nous définissons vertical-align:middle; pour les images et les zones de texte (tout autre élément de bloc en ligne)), cela affectera le désalignement du chinois et de l'anglais.
Une autre situation est que lorsque l'élément parent (à l'exception des tableaux) a l'attribut d'alignement vertical défini, les sous-éléments chinois et anglais à l'intérieur seront également mal alignés.
Parlons d'abord de la première solution, qui est la solution au problème de déviation causé par le milieu vertical des éléments adjacents : ajoutez un zoom : 1 aux objets chinois et anglais pour déclencher sa mise en page aléatoire. Grâce à la recherche, nous avons trouvé. qu'une fois qu'il aura une mise en page, il n'y aura aucun désalignement entre le chinois et l'anglais.
Le deuxième cas est la verticale du parent element Solution au problème de désalignement causé par -middle : ajoutez la phrase vertical-align:baseline aux objets chinois et anglais pour le résoudre !
Mais on voit que le soulignement semble trop serré , à ce stade, nous devons encore ajouter zoom:1 pour déclencher son hasLayout afin d'éviter un ajustement trop serré !
Si vous rencontrez d'autres situations dans lesquelles le chinois et l'anglais ne sont pas correctement alignés, alors vous pouvez également essayer d'utiliser les deux méthodes ci-dessus pour le résoudre. Bien sûr, la solution la plus sûre et la plus efficace consiste à utiliser la police Song en chinois et en anglais.
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!
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn