谷歌浏览器 - 文本背景使线条

Question

我试图在我的文本上有一个实时背景，这是我网站上的标题，我使用-webkit-text-fill-color ，.....

但是这样做之后，我看到页面上出现了一些不可见的线条。

这个问题刚刚出现在谷歌浏览器中，我不知道该怎么办。

我使用的是 Google Chrome 版本 85.0.4183.83（官方版本）（64 位）。

我在使用 Firefox 或其他浏览器时没有这个问题。

提前致谢。

Answer 1

您的 CSS 属性不符合此效果所需的顺序。

首先填充颜色，然后剪辑，然后是背景，然后是备用颜色：

-webkit-text-fill-color: transparent;
-webkit-background-clip: text;
background: ...;
color: ...;