Css 使用带有百分比的transform translateY时,Chrome现在会模糊文本
几天以来,当使用css3 transform(transform:translateY(-50%);)使用非常酷的技术垂直居中div时,我正在试验一个相当大的问题,如下所述: 实际上,这个div中包含的元素(文本或图像)变得模糊 我尝试了很多技术(变换:translateZ(0);背面可见性;比例(1);translateX(计算(-50%+0.5px));过滤器:模糊(0);等等)。但实际上什么都不管用 唯一有效的方法是使用另一种垂直居中div的技术,如display:table cell 但是,出于显而易见的原因(比如添加div容器的义务),我宁愿不这样做 所以我有两个问题: 首先,你知道一种有效的方法吗? 第二,最新(或最新)版本的Chrome是否是新版本 谢谢你的帮助 大卫 附言: 这里表达的所有旧的解决方案Css 使用带有百分比的transform translateY时,Chrome现在会模糊文本,css,google-chrome,transform,blur,translate,Css,Google Chrome,Transform,Blur,Translate,几天以来,当使用css3 transform(transform:translateY(-50%);)使用非常酷的技术垂直居中div时,我正在试验一个相当大的问题,如下所述: 实际上,这个div中包含的元素(文本或图像)变得模糊 我尝试了很多技术(变换:translateZ(0);背面可见性;比例(1);translateX(计算(-50%+0.5px));过滤器:模糊(0);等等)。但实际上什么都不管用 唯一有效的方法是使用另一种垂直居中div的技术,如display:table cell
暂时不要工作,我只找到了一个好的解决方案:
transform: translate(-50%, -50.1%)
- 0.1%-一般情况下,用户看不到这一点
- 不需要计算值
希望chrome能够解决这个问题——这个漏洞自2014年就存在了。)可能与上述URL中提供的任何解决方案都不起作用。我认为Chrome53版本出现了这个问题你是说
translateY(
…)代码>?