需求:只修改输入框光标的样式,输入字体样式不变
推荐方法·:
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; }
其他方法:
- 字体和光标同时改变
input { color: red; }
- 有兼容性问题,低版本浏览器部分移动端不会显示
input { caret-color: red; // css3属性 }