placeholder兼容性问题

1、输入框提示信息在placeholder为普遍应用之前,普遍采用使用JavaScript来实现输入框提示。HTML5提供了placeholder来帮助实现提示,不需要任何的JavaScript。只需要在你的input文本框的标记上添加HTML5规范里新增的placeholder属性,然后在属性值里输入你需要的提示信息。如下所示:

<input placeholder=”提示信息...”>

2、可以通过CSS3来美化placeholder提示信息的样式。但是placeholder存在浏览器兼容,为了更大兼容浏览器,采用如下方式

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



猜你喜欢

转载自blog.csdn.net/xuexizhe88/article/details/79278507