Html 有没有办法改变占位符的一个单词的颜色

假设我有这个文本字段

<input type="text" placeholder="I am placeholder">

---

此代码将更改完整的占位符颜色，但我只想更改word

占位符的颜色，而不是在complete
i am placeholder
上更改。您不可能使用标准的占位符来执行此操作。相反，制作一个
div
，并将您的输入元素和一个子元素（比如
span/p
元素）放入该
div
中，并将
span/p
放置在您的输入元素中，然后将
span/p
元素隐藏在焦点上

类似这样的内容：
您可以查看：

编辑：对于现在的，请参阅并使用
背景剪辑
更新下面的（第三个片段）


标签{
显示：内联块；
背景：线性渐变（向右，红色2.2em，蓝色2.2em）；
边框：插图；
/*在这里输入边框*/
字体系列：monospace；
/*对屏幕上的文本长度不太惊讶*/
}
输入{
盒影：镶嵌0.2米白色；
/*覆盖混合所需的背景*/
}
输入：无效{
/*仅当显示占位符时，为文本的一部分添加颜色*/
混合模式：屏幕；
}
/*片段免责声明*/
.免责声明{
混合模式：屏幕；
}
身体{
背景：白色；
}

“您的浏览器”还不可用，请耐心等待。
不！我认为这样的事情不存在。您可能希望使用JS来实现这一点。可能的重复请您解释一下关于
混合混合模式
@GauravAggarwal混合模式允许不同的堆叠元素通过不同的过滤器将颜色混合在一起。它允许在这里混合黑暗，以与下面的渐变色混合，而白色则没有。每个值都有不同的效果。那么我们可以调整颜色区域的大小吗？@GauravAggarwal是的，在这里我在前2.2米（我是）处设置了红色，然后其余的将是蓝色（红色/蓝色可以是透明的或任何颜色）
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: pink;
}
::-moz-placeholder { /* Firefox 19+ */
  color: pink;
}
:-ms-input-placeholder { /* IE 10+ */
  color: pink;
}
:-moz-placeholder { /* Firefox 18- */
  color: pink;
}