有没有办法用不同的颜色部分填充文本？ [复制]

【问题标题】：Is there a way to partially fill text with different colours? [duplicate]有没有办法用不同的颜色部分填充文本？ [复制]
【发布时间】：2018-09-11 03:31:29
【问题描述】：

这是我想要实现的目标：

有没有办法使用 W3 网络技术来做到这一点，例如SVG、画布？

【问题讨论】：

标签： css svg canvas

【解决方案1】：

是的，您可以使用 text-fill-color 和 background-clip 属性。

html, body {
  background: #000;
}

p {
  margin: 0px;
}

#clip {
  background: linear-gradient(to right, rgba(127, 127, 127, 1) 23%, rgba(234, 85, 7, 1) 20%, rgba(234, 85, 7, 1) 57%, rgba(127, 127, 127, 1) 59%);
  background-attachment: fixed;
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  font-size: 8vw;
  font-weight: bold;
  text-align: center;
}

&lt;p id="clip"&gt;Lorem ipsum dolor sit &lt;/p&gt;

注意：请访问this link了解更多信息。

【讨论】：

出色的解决方案，谢谢！