您的位置:首页 > Web前端 > HTML5

HTML5 的placeholder属性(兼容各版本)

2014-07-01 09:24 597 查看
Placeholder是HTML5新增的另一个属性,当input或者textarea设置了该属性后,该值的内容将作为灰字提示显示在文本框中,当文本框获得焦点时,提示文字消失。

placeholder 点击可下载(写好的案例)

其它情况:

当在IE10以下版本中占位文本的颜色是黑色;IE10以上版本(其它浏览器最新版本)为灰色,为了兼容IE10以下版本(老版本)统一让占位符更改为灰色,建议可以利用以下方法更改占位文本颜色值。

基本代码:

<input type="text" value="placeholder text" onfocus="this.style.color='#000'; 

this.value='';" style="color: #f00;"/>

完善代码:

<input type="text" value="placeholder text" onfocus="if(!this.haswriting){this.style.color='#000'; this.value='';}" onblur="if(!this.value){this.style.color='#f00'; this.value='placeholder text'; this.haswriting=false;}else{this.haswriting=true};" style="color:
#f00;"/>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  html5 placeholder