CSS：transform：translate（-50％， - 50％）使文本模糊

Question

我希望将div作为中心并使用此方法，但它会使我的文字在div内模糊：

<!-- language: lang-css -->

#div {
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

有没有办法集中我的div？

Answer 1

在要翻译的元素块周围添加这些样式以修复消除锯齿，将Z轴转换为零值。

-webkit-font-smoothing: subpixel-antialiased;
-webkit-transform: translateZ(0) scale(1.0, 1.0);