文本框中灰色提示性文字

灰色提示性文字

1. 很多网站的文本框都有灰色提文字，一点即消失，鼠标移开又出现，将下面这段代码加载到input 中即可实现。

    value="你的提示文字" 
    onFocus="if(value==defaultValue){value='';this.style.color='#000'}" 
    onBlur="if(!value){value=defaultValue;this.style.color='#999'}" 
    style="color:#999999"  

1. 也可以使用HTML5中新增的属性：placeholder

<form action="demo-form.php">
  <input type="text" name="fname" placeholder="First name"><br>
  <input type="text" name="lname" placeholder="Last name"><br>
  <input type="submit" value="提交">
</form>

修改placeholder的颜色和字体

<style>
::-webkit-input-placeholder { /* WebKit, Blink, Edge */
   color:#999;
   font-size:14px;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:#999;  opacity:1;
   font-size:14px;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:#999;  opacity:1;
   font-size:14px;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:#999;
   font-size:14px;
}
</style>