为什么我的 Chrome 字体在模态框中渲染模糊以及如何修复它？

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中文网其他相关文章！