用css改变input光标的3种方法

方法一：
这也是最简单的一种了,但是字体颜色也会跟着一起变化

input{
	color:red;
}

方法二：
此方法有兼容性要求，低版本浏览器跟部分移动端不会显示

input{
	caret-color:red;  //css3属性
}

方法三：
此方法主要是利用镂空属性，隐藏原本文字，再利用text-shadow改变字体的颜色，而光标的颜色不变

input,textarea { 
   color: rgb(60, 0, 248); /* 光标的颜色*/ 
   text-shadow: 0px 0px 0px #D60B0B; /* 文本颜色 */ 
   -webkit-text-fill-color: transparent;
} 
/*此外下面的placeholder改变颜色同样适用*/
input::-webkit-input-placeholder{
    color: rgb(60, 0, 248); /* 改变placeholder文本颜色 */
    text-shadow: none;
    -webkit-text-fill-color: initial; 
 }