光标和输出不具有相同的颜色css

Question

我想个性化输入字段，因此光标将为蓝色，写入将为黑色。当我写的时候我想要光标和输出没有相同的颜色。我怎样才能做到这一点 ？

Answer 1

检查这是否是你想要的？

<强> DEMO HERE

input
{
    font-size: 24px;
    padding: 10px;
    color: blue; //Change to whatever color you want
    text-shadow: 0px 0px 0px #000;
    -webkit-text-fill-color: transparent;
}
input::-webkit-input-placeholder
{
    text-shadow: none;
    -webkit-text-fill-color: initial;
}