iOS 9 iPad 空气文字阴影渲染伪影

Question

用html如下：

<h1>Lorem ipsum Incididunt minim enim pariatur ex in irure Duis deserunt.</h1>

还有css：

h1 {
  color: #fff;
  font-size: 4em;
  font-family: sans-serif;
  text-shadow: 2px 2px 8px #000;
}

我在 iPad air（1 和 2）上的 iOS 9.3.2 上渲染时遇到了一些奇怪的阴影伪影。该问题在 iPad mini 1 或 2 或 iOS 10.1 上无法重现。

我尝试更改字体、行高、阴影中的 alpha 透明度等......罪魁祸首似乎只是使用带有原始 h1 元素的任何文本阴影（我假设其他元素）。当字体较大且文本颜色为白色时，该问题似乎更容易重现，但肯定存在只有文本阴影属性（可能需要稍微放大和缩小才能重新创建它）。

在提供的屏幕截图中捕获的问题非常小，但使用不同的文本/字体大小有时会更糟。

有人知道根本原因的任何信息吗？有谁知道这会影响哪些设备/操作系统版本？有谁知道这个问题有什么好的解决方法吗？

jsfiddle：https://jsfiddle.net/t7ccn528/

Answer 1

尝试将 h1 定位为相对或绝对（无论哪个适用于它在树中的位置）。然后添加一个 top:0;

也试试：

弄乱了 H1 上的字体平滑 CSS 属性，特别是亚像素抗锯齿。分别和一起尝试这两个。我无法在我的 Browserstack VM 上进行复制，否则我可能会解决这个问题。