Question

我正在尝试使占位符文本看起来与输入到表单字段中的实际文本完全相同。

第一个字段显示占位符文本。看起来像灰色文字。

第二个字段显示输入到字段中的文本。看起来更黑。

这是html代码：

<p>Twitter Link</p>
<input type="text" placeholder="http://twitter.com" />

<p>Google+ Link</p>
<input type="text" placeholder="" />

和css代码：

::-webkit-input-placeholder {color: #000;}
:-moz-input-placeholder     {color: #000;}
::-moz-input-placeholder    {color: #000;}
input::-moz-placeholder     {color: 000;}

我在firefox中遇到麻烦。

Answer 1

一个问题是你忘记了颜色代码前面的＃标签符号（if(!$('#slide_'+(slide_current-1)).find('iframe').hasClass('edgeanimate'))// { //Do nothing. } else { //Pause/Stop the sound, please }）：

由于它是CSS中最低的，它可能会覆盖以前的样式：

input::-moz-placeholder 
{color: 000;}

此外，对于占位符来说，还有相当多的CSS可以让它跨浏览器：

input::-moz-placeholder 
{color: #000;}

小心避免不良对比。 Firefox的占位符似乎默认为不透明度降低，因此需要使用不透明度：1。

_{This code and quote comes from this excellent SO answer}

JSFiddle Demo

Answer 2

试试这个：

HTML：

<input type="text" placeholder="http://twitter.com" />

CSS：

input::-webkit-input-placeholder {
    color: #000;
}

以下是具有上述代码的jsfiddle：https://jsfiddle.net/e0d8my79/49/

使占位符文本看起来像表单字段中的输入文本。附图

2 个答案:

JSFiddle Demo