input光标颜色

input光标颜色

一、 使用color实现

光标的颜色是继承自当前输入框字体的颜色，所以用color属性即可改变：

input {
    color:red;
}

二、使用caret-color实现

只改变光标的颜色而不改变字体的颜色需要使用caret-color属性:

<input value="This field uses a default caret." />
<input class="custom" value="I have a custom caret color!" />
input {
  caret-color: auto;
  display: block;
  margin-bottom: .5em;
}

input.custom {
  caret-color: red;
}