html表单居中_如何在IE低版本中兼容HTML5表单属性placeholder属性

WEB开发数据提交是必不可少的，为了更友好的用户体验，通常需要给输入框一个默认的提示信息。HTML5技术提供了一个表单属性placeholder专门用于输入框默认提示，但是在IE低版本中根本不兼容。

---

例如：

兼容placeholder属性

*{margin:0px;padding:0px;}

.userid{position:relative;}

input{width:300px;height: 48px;}

在IE9中开始不兼容

---

那如何在IE低版本中兼容HTML表单属性placeholder呢？

解决思路：

1. 判断浏览器是否兼容HTML表单属性placeholder
2. 当浏览器不兼容HTML表单属性placeholder时，在输入框上方放一个和输入框一模一样的段落标签

   。

3. 当段落标签

   被点击时，段落标签隐藏，输入框获得焦点。

4. 当输入框失去焦点时，判断输入框内容是否为空，如果没有输入内容或者输入空格，那么显示段落标签，否则段落标签不显示。

---

例如：

兼容placeholder属性

在IE9中也兼容

如有遗漏欢迎评论区留言，继续交流谢谢。