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);