input标签placeholder属性修改输⼊框光标的样式需求:只修改输⼊框光标的样式,输⼊字体样式不变
推荐⽅法·:
input,
textarea {
font-size: 24px;
padding: 10px;
color: #0351FB; // 光标颜⾊
text-shadow: 0 0 0 #212121; // ⽂本颜⾊
-webkit-text-fill-color: transparent; // 隐藏原本⽂字
}
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder{
color: #F3F4FB;  // 改变placeholder⽂本颜⾊
text-shadow: none;
-webkit-text-fill-color: initial;
}
其他⽅法:
1. 字体和光标同时改变
input {
color: red;
}
2. 有兼容性问题,低版本浏览器部分移动端不会显⽰
input {
caret-color: red;  // css3属性
}

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。