如何在文本字段中显示多种字体颜色答案

【问题标题】：How to show multiple font colors inside the Text Field如何在文本字段中显示多种字体颜色
【发布时间】：2012-04-12 06:50:34
【问题描述】：

我想要文本字段中的文本，例如“你的名字*”
“你的名字”的颜色应该是黑色，* 的颜色应该是红色。
我该怎么做？？

请帮帮我。

【问题讨论】：

AFAIK，您不能部分更改文本字段或文本区域中的文本颜色。您需要考虑使用 contenteditable 属性并将其内容复制到文本字段以存储值（就像大多数所见即所得编辑器所做的那样）

标签： css textbox textfield required-field

【解决方案1】：

你不能；文本输入字段的值是纯文本。

将解释（包括必要性指示符（如果需要））放在标签中，而不是放在字段中。您可以为指标使用标记，并为其着色：

<label for=name>Your name<span class=reqd>*</span>:</label>
<input id=name name=name size=40 required>

【讨论】：

感谢您的快速回复。我的设计师给了我包含此类文本字段的页面设计，正如我在上面的问题中提到的那样。这对我来说是新事物。 :)

【解决方案2】：

我想你应该想要这个

CSS

label{
    color:black;
}
label  span {
    color:red;
}
input{
    line-height:25px;
    color:gray;
    font-size:16px;
}

input:focus{
color:black;
}

HTML

<label>
    Your Name:- <input type="text" value="your name"><span>*</span>
</label>

现场演示http://jsfiddle.net/rohitazad/dZmaZ/

【讨论】：

ma ne kuch din howe 加入 kiya he ye 网络。 bhot achi site he ye.

【解决方案3】：

您不能在一个文本框中使用不同的颜色。（无论如何，跨浏览器都是可靠的）

对于必填字段来说，解决此问题的最常见方法是将星号直接放在一个元素中的文本框之后，并带有一个将文本设置为红色的类。

示例：http://jsfiddle.net/JzFd4/

【讨论】：

我想在我的图像上悬停圆圈。它是分辨率为 230 x 231 的图像。当鼠标悬停在图像上时，它只会显示圆形部分。会怎么样？
针对您的问题创建一个新问题，整个社区都可以提供帮助:)
我创建了较新的，但系统告诉我它不符合我们的质量标准。 :(
不要让它让你失望，再试一次，包括尽可能多的信息和代码。尝试一下您要实现的目标，并询问您遇到的问题。祝你好运

【解决方案4】：

这就是我在这里提出的问题。
多种颜色占位符。
Answer Link Here

这里有一些技巧

.input-field {
    position: relative;
    display: inline-block;
}
.input-field > label {
    position: absolute;
    left: 0.5em;
    top: 50%;
    margin-top: -0.5em;
    opacity: 0.5;
}
.input-field > input[type=text]:focus + label {
    display: none;
}
.input-field > label > span {
    letter-spacing: -2px;
}
.first-letter {
    color: red;
}
.second-letter {
    color: blue;

<div class="input-field">
    <input id="input-text-field" type="text"></input>
    <label for="input-text-field"> 
        <span class="first-letter">your name</span>  
        <span class="second-letter">*</span>
    </label>
</div>

【讨论】：