效果如下
具体代码：
<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>CSS图像填充文字</title><style>.text {background-image: url(./imgs/1.webp);/* 一定要让背景透明，这样后面的背景能透出来 */color: transparent;font-size: 50px;text-align: center;/* 以 盒子内 文字 作为 裁剪区域 ，向外 裁剪，文字之外 的 区域 都将 被 裁剪掉 */-webkit-background-clip: text;/* 这行代码是为了不让vscode报警告 */background-clip: text;}</style></head><body><div class="text"><h3>CSS</h3><p>CSS图像填充文字</p></div></body>
</html>
