Chrome 字体渲染模糊已解决:CSS 罪魁祸首已确定
Chrome 中字体模糊的老问题多年来一直困扰着用户,关于其原因的争论无休无止。在本例中,用户在 Chrome 版本 39 中的模式框中遇到了严重模糊。
对所提供的 CSS 代码的彻底检查表明,原因在于负责定位模式框的 CSS 属性。具体来说,“变换”属性设置 Y 轴平移会出现问题:
transform: translateX(-50%) translateY(-50%);
此特定设置导致模态中的文本显得模糊。通过对该值进行实验,用户发现从 Y 轴平移中减去 0.5px 可以解决问题。
更新的 CSS:
transform: translateX(-50%) translateY(calc(-50% - 0.5px));
此修改有效地锐化了字体渲染,在不改变模式框对齐的情况下解决模糊问题。用户注意到这个解决方案比调整百分比值或依赖 JavaScript 更优雅。
以上是为什么我的 Chrome 字体在模态框中渲染模糊以及如何修复它?的详细内容。更多信息请关注PHP中文网其他相关文章!