Chrome的文字陰影錯誤

Question

Codepen鏈接：https://codepen.io/calebzahnd/pen/OWxxLw

h1 { 
    max-width: 800px; 
    font-family: sans-serif; 
    font-size: 90px; 
    font-weight: 900; 
    text-shadow: 0 0 50px #000; 
} 

截圖：

我發現我只能想象顯示時，在Chrome瀏覽器，一個bug在視網膜屏幕上。文字陰影上有一個奇怪的剪輯，文字陰影本身被推到實際文本下面。調整字體大小時，剪輯將隨機更改爲僅剪輯某些字符。如果您調整文本陰影的藍色值，則某些值會將陰影回調到應該放置的位置，但沒有任何韻律或原因。我已經檢查過，並且在Safari和Firefox上顯示效果很好。有人可以解釋這裏發生了什麼嗎？

Answer 1

我可以在Chrome和Safari瀏覽器中使用我的視網膜顯示屏完美地看到文本陰影。 嘗試更新瀏覽器和/或清理緩存。

Answer 2

h1 { 
 
\t max-width: 800px; 
 
\t font-family: sans-serif; 
 
\t font-size: 90px; 
 
\t font-weight: 900; 
 
\t text-shadow: 0 0 50px #000; 
 
     margin-left:25px; 
 
}

<h1>This is what you want everyone to see</h1>

的問題是，有這麼大的陰影，而文字是正確的對像素邊緣。某些設備/瀏覽器不會渲染超過窗口或div的像素邊緣。我的建議是在文字左側留出25px的餘量。甚至25周圍。