选择输入值的第一个字母，并通过CSS更改它的颜色 [英] Select first letter of input value and change it's color via CSS
问题描述
有没有办法选择文本输入值的第一个字母，并通过样式表中的CSS更改其颜色？
例如，我有
< input type =textname =addressvalue = *物业地址：/>
我只想选择value属性（*）的第一个字母，并将其更改为红色颜色与CSS。是不是真的可以用css做？
我不认为输入框会允许改变第一个信 - 似乎操作系统不能实现。所以你可以用 contentEditable 属性来制作一个 div ，这个属性等于true，并获得它的内容与JavaScript，或两个输入水平对齐或一些小的解决方法。看到这个：
< html>
< head>
.leftInput {
border-bottom：1px纯黑色;
border-left：1px纯黑色;
border-top：1px纯黑色;
border-right：0px;
width：10px;
颜色：红色;
}
.rightInput {
border-bottom：1px纯黑色;
border-right：1px纯黑色;
border-top：1px纯黑色;
border-left：0px;
margin-left：0px;
}
< / head>
< body>
< / body>
< / html>
。 leftInput {border-bottom：1px纯黑色; border-left：1px纯黑色; border-top：1px纯黑色; border-right：0px;宽度：10px; color：red;}。rightInput {border-bottom：1px solid black; border-right：1px纯黑色; border-top：1px纯黑色; border-left：0px; margin-left：0px;}
< input type = textname =addressvalue =*class =leftInput/>< input type =textname =addressvalue =Property Address：class =rightInput/>
Is there a way to select the text input values first letter and change its color via CSS in the stylesheet? so for example, I have
<input type="text" name="address" value="* Property Address :" />
I would like to select only the first letter of the value property (*) and change it to red color with CSS. Is that actualy possible to do with css ?
I don’t think that input boxes will allow changing the style of the first letter – it seems the OS does not make it possible. So you can make a div with contentEditable property equal to "true", and get its content with JavaScript, or a small workaround with two inputs aligned horizontally, or something. See this:
<html>
<head>
.leftInput{
border-bottom: 1px solid black;
border-left: 1px solid black;
border-top: 1px solid black;
border-right: 0px;
width:10px;
color:red;
}
.rightInput{
border-bottom: 1px solid black;
border-right: 1px solid black;
border-top: 1px solid black;
border-left: 0px;
margin-left: 0px;
}
</head>
<body>
<input type="text" name="address" value="* " class="leftInput" /><input type="text" name="address" value="Property Address :" class="rightInput" />
</body>
</html>
.leftInput {
border-bottom: 1px solid black;
border-left: 1px solid black;
border-top: 1px solid black;
border-right: 0px;
width: 10px;
color: red;
}
.rightInput {
border-bottom: 1px solid black;
border-right: 1px solid black;
border-top: 1px solid black;
border-left: 0px;
margin-left: 0px;
}
<input type="text" name="address" value="* " class="leftInput"
/><input type="text" name="address" value="Property Address :" class="rightInput" />
这篇关于选择输入值的第一个字母，并通过CSS更改它的颜色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
