HTML5轻松实现搜索框提示文字点击消失---及placeholder颜色的设置

在做搜索框的时候无意间发现html5的input里有个placeholder属性能轻松实现提示文字点击消失功能，之前还傻傻的在用js来实现类似功能。。。

示例

<form action="demo_form.asp" method="get">
  <input type="search" name="user_search" placeholder="我是提示文字 在此输入文本我会消失" />
  <input type="submit" />
</form>

根据浏览器的不同，效果也不同。
有些会在鼠标focus文本框时，文字直接消失。
有些则会在输入文本时消失。

占位文本颜色设置如下

::-webkit-input-placeholder { /* WebKit browsers */ 
color: #999; 
} 
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ 
color: #999; 
} 
::-moz-placeholder { /* Mozilla Firefox 19+ */ 
color: #999; 
} 
:-ms-input-placeholder { /* Internet Explorer 10+ */ 
color: #999; 
} 

转载于:https://www.cnblogs.com/pspgbhu/p/5705982.html