Html 带有移动背景的css剪辑文本

说到CSS，我真的是个新手——但我看到了将文本用作背景遮罩的酷效果。我让它工作得很好，但我已经下定决心尝试动画的背景，以不断地滑动到左边。我就是做不到

h1{
字体系列：Poppins；
字号：12rem；
颜色：透明；
背景图片：url（people.jpg）；
背景尺寸：封面；
背景重复：重复-x；
背景剪辑：文本；
-webkit背景剪辑：文本；
动画：幻灯片背景15s线性无限；
}
@关键帧滑动背景{
从{
变换：translateX（0）；
}
到{
转化：translateX（-100%）；
}
}

人

将其更改为：

@关键帧幻灯片\u背景{
从{
背景位置：0px 0px；
}
到{
背景位置：100%0px；
}
}

---

现在它开始工作了！感谢@Temani Afif指出我做错了什么。

有关信息：您也可以在动画中使用混合模式和文本缩进

h1{
字体系列：Poppins；
字号：12rem；
位置：相对位置；
z指数：1；
背景：白色；
保证金：0；
动画：幻灯片背景15s线性无限；
}
h1：之前{
内容：“；
混合模式：屏幕；
位置：绝对位置；
排名：0；
左：0；
身高：100%；
宽度：100%；
背景：url(http://lorempixel.com/output/fashion-q-c-640-480-10.jpg);
背景尺寸：封面；
}
@关键帧滑动背景{
从{
文本缩进：0；
}
到{
文本缩进：-100vw；
}
}

---

人物

您需要设置背景位置动画，而不是平移整个场景element@TemaniAfif我该怎么做呢？和你正在做的完全一样，但是你不用转换，而是用背景位置更新你的代码来显示它，这样我们就可以知道为什么它不是working@TemaniAfif非常感谢你！