两个半相关的问题:HTML/CSS输入/ textarea的,默认的文本和颜色
1)我已经看到了包含一些默认的文本,如“请在此输入搜索词” <input>
和<textarea>
盒,当你点击框时,文字消失。这是如何实施的?这是一个Javascript的东西?
2)默认文本是否可以是一种颜色,无论您输入什么(覆盖或附加),都可以使用不同的颜色?
两个半相关的问题:HTML/CSS输入/ textarea的,默认的文本和颜色
1)我已经看到了包含一些默认的文本,如“请在此输入搜索词” <input>
和<textarea>
盒,当你点击框时,文字消失。这是如何实施的?这是一个Javascript的东西?
2)默认文本是否可以是一种颜色,无论您输入什么(覆盖或附加),都可以使用不同的颜色?
不知道为什么上面的标记控制水印文本作为回答,因为它实际上并没有回答这个问题。 希望这样做:
HTML4
<label for="name">Name</label>
<input type="text" name="name" value="Enter your full name" onfocus="if(this.value=='Enter your full name') {this.value='', this.style.color='#999'};" onblur="if(this.value=='') {this.value='Enter your full name', this.style.color='#555';}" />
让我们把它分解:
value="Enter your full name"
这增加了文本的默认字符串输入。
<textarea>Enter your comment</textarea>
同样可以通过在标签之间输入文本来实现textarea。
如果输入接收焦点(即点击或选项卡上),我们检查,如果当前输入文本等于我们默认的文本字符串“中输入您的全名”。如果是,我们将其设置为空字符串并更改字体颜色。
onblur="if(this.value=='') {this.value='Enter your full name', this.style.color='#555';}
当输入失去焦点时,我们检查当前输入文本是否为空白。如果是这样,我们回到我们的默认文本字符串,并将颜色改回原来的状态。
HTML5
<input type="text" name="name" placeholder="Enter your full name">
<textarea placeholder="Enter your comment"></textarea>
HTML5有一个内置的 '占位符' 属性这样做,可以通过以下方式来称呼:
::-webkit-input-placeholder { color:#555; } /* Webkit */
:-moz-placeholder { color:#555; } /* Firefox <= 18 */
::-moz-placeholder { color:#555; } /* Firefox >= 19 */
:-ms-input-placeholder { color: #555; } /* Internet Explorer */
它们被称为输入水印。你可以找到很多jQuery插件来做到这一点。这是one of them
您可以使用CSS