Pourquoi le rendu de ma police Chrome est-il flou dans une boîte modale et comment puis-je y remédier ?

Flou du rendu des polices Chrome résolu : le coupable CSS identifié

Le problème séculaire des polices floues dans Chrome tourmente les utilisateurs depuis des années, avec des débats interminables sur sa cause. Dans ce cas, l'utilisateur a rencontré un flou important dans une boîte modale dans la version 39 de Chrome.

Une inspection approfondie du code CSS fourni suggère que la cause réside dans la propriété CSS responsable du positionnement de la boîte modale. Plus précisément, des problèmes surviennent avec la propriété « transform » définissant la traduction de l'axe Y :

transform: translateX(-50%) translateY(-50%);

Ce paramètre particulier rendait flou le texte dans le modal. En expérimentant la valeur, l'utilisateur a découvert que la soustraction de 0,5 px de la traduction de l'axe Y résolvait le problème.

Le CSS mis à jour :

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

Cette modification affine efficacement le rendu de la police, résoudre le problème de flou sans modifier l'alignement de la boîte modale. L'utilisateur note que cette solution est plus élégante que d'ajuster la valeur en pourcentage ou de s'appuyer sur JavaScript.

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!