样式文本输入插入符号 [英] Styling text input caret

问题描述

我想设置聚焦 的插入符号的样式.具体来说，颜色和厚度.

I want to style the caret of a focused <input type='text'/>. Specifically, the color and thickness.

推荐答案

如果您使用的是 webkit 浏览器，您可以按照下一个 CSS 片段更改插入符号的颜色.我不确定是否可以使用 CSS 更改格式.

If you are using a webkit browser you can change the color of the caret by following the next CSS snippet. I'm not sure if It's possible to change the format with CSS.

input,
textarea {
    font-size: 24px;
    padding: 10px;
    
    color: red;
    text-shadow: 0px 0px 0px #000;
    -webkit-text-fill-color: transparent;
}

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
    color:
    text-shadow: none;
    -webkit-text-fill-color: initial;
}

这是一个例子:http://jsfiddle.net/8k1k0awb/

这篇关于样式文本输入插入符号的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！