Safari中的Text-Shadow在元素边框之外被切断/不渲染

Question

正如标题所说，我有一个带有以下内容的文字阴影：

body { background: white; }

h1 { 
    color: black;
    text-shadow: 100px 100px 10px black;
}

在Safari浏览器中，阴影被剪裁/不渲染超出元素边界的边缘。

当我触发身体背景颜色动画效果（一种将颜色从白色转换为黑色的俗气）时，陌生人是什么？它似乎在过渡期间在短时间内正确地渲染到元素边界之外。然而，一旦过渡结束，阴影在边界处再次被切断。

Answer 1

如果在转换过程中可见，请添加-webkit-transform：translateZ（0）;它。应该管用。你确定削减它的元素不会溢出：隐藏吗？另一个想法是：切割阴影的元素是否可能被三维转换？如果是，那就是原因。它充当所有孩子的视口。如果以上都不起作用，我无法在没有最小，完整和可验证的示例的情况下帮助您。在这里重现这个bug。 - Andrei Gheorghiu 4月19日＆17; 17日13:13 1

<强>解决方案

-webkit-transform：translateZ（0）;以及显式内联显示：阻止; （如果它在我的.css文件中似乎没有工作）为我修复了这个问题。谢谢你的建议！很抱歉，我没有提供更多代码作为示例，但帖子可能已经增长了太长时间。 Safari有时会感觉像浏览器的丛林...... - Starcat 4月20日＆17; 17 0:03