版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/qq_38627581/article/details/80243477
使用input输入框时，默认光标颜色是和字体颜色相同的，只需css设置color属性就可以同时改变光标和字体颜色
但有时的需求是光标和字体颜色不一样，网上的caret方法经测试chrome并不管用，所以，代码如下
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>改变input按钮的光标颜色,不改变字体颜色</title>
<style>
#input1 {
color: #000;
}
#input2 {
/*改变光标颜色*/
color: red;
text-shadow: 0px 0px 0px #000;
-webkit-text-fill-color: transparent;
}
</style>
</head>
<body>
设置color颜色，光标颜色和字体颜色相同<input id="input1" type="text"/>
<br/>
<br/>
只改变光标颜色，不改变字体颜色: <input id="input2" type="text"/>
</body>
</html>兼容性：测试了chrome和ie浏览器，chrome下生效，ie下无效
如果大家有好的方法，欢迎留言~~