MacOS的Safari浏览器文本阴影缺失

问题描述：

这里的问题是https://jsfiddle.net/smdLzsx5/1/MacOS的Safari浏览器文本阴影缺失

的例子有人可以看一看，看看是否出现了他们的错误？我有兴趣了解问题是否可以持续转载，以便我可以将其报告给苹果公司。

代码：

<html> 
<head> 
<style> 

.header01{ 
    background-color:#d0d0d0; 
    overflow:hidden; 
    border-radius:5px; 
    width:500px; 
} 

.heading01{ 
    color:#ffffff; 
    text-shadow:0px 2px 4px #000000; 
    font-size:40pt; 
} 

</style> 
</head> 
<body> 
    <div class="header01" id="header"> 
     <div class="heading01"> 
       BAD<span>GOOD</span> 
     </div> 
    </div> 
</body> 
</html>

在某些情况下（例如，上面的代码）的文字阴影不呈现 - 或它短暂地出现然后再次消失。

我使用MacOX 10.12.6（16G29），Safari浏览器11.0（12604.1.38.1.7）

问题不会在Firefox 56或Chrome 61.0.3163.100

许多事情发生会影响问题如：

改变HEADER01 div的宽度（它改变至200像素和无的的文字阴影绘制）
设置HEADER01 DIV溢出：可见; （阴影正确呈现）
更改heading01字体大小为20pt（阴影呈现正确地）

在我的Safari上看起来不错 – Thielicious

答

尝试删除 '溢出：隐藏;'来自'.header01'类。看起来这是它造成的。

感谢Laura的回复，但我在问题中已经注意到了这一点。我的问题是这个错误是否发生在其他人身上。 – user1608371

我在Safari中看到了这个问题 – Laura

MacOS的Safari浏览器文本阴影缺失

相关推荐