Pourquoi les polices Chrome Modal Box sont-elles floues et comment les corriger ?

Police Chrome floue dans la boîte modale : problème CSS résolu

Les utilisateurs de Chrome peuvent rencontrer des polices floues dans les boîtes modales, tandis que d'autres navigateurs comme IE et Firefox les affiche clairement. Cette disparité est due à une propriété CSS spécifique qui affecte le rendu du texte.

Le problème vient de la propriété transform appliquée au conteneur modal, à savoir transform: traduireX(-50%) traduireY(-50%). Cette transformation déplace effectivement le modal de la moitié de sa largeur et de sa hauteur, provoquant une anomalie de rendu qui rend les polices floues.

Pour résoudre ce problème, le CSS peut être modifié en soustrayant une petite valeur à la transformation de l'axe Y. . En soustrayant 0,5px de la valeur négative de 50 %, le rendu du texte devient fluide et net.

L'extrait de code corrigé serait :

transform: translateX(-50%) translateY(calc(-50% - .5px));

Cette solution garantit que le modal reste centré pendant éliminant le problème de police floue. En affinant le CSS, les navigateurs Chrome peuvent afficher les polices dans des zones modales avec la même clarté que les autres navigateurs.

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!