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;
}