码迷,mamicode.com
首页 > Web开发 > 详细

HTML 5 <input> placeholder 属性

时间:2014-12-19 19:02:35      阅读:236      评论:0      收藏:0      [点我收藏+]

标签:

原文链接:http://www.w3school.com.cn/html5/att_input_placeholder.asp

HTML 5 <input> placeholder 属性

实例

带有 placeholder 文本的搜索字段:

<form action="demo_form.asp" method="get">
  <input type="search" name="user_search" placeholder="Search W3School" />
  <input type="submit" />
</form>

亲自试一试

定义和用法

placeholder 属性提供可描述输入字段预期值的提示信息(hint)。

该提示会在输入字段为空时显示,并会在字段获得焦点时消失。

注释:placeholder 属性适用于以下的 <input> 类型:text, search, url, telephone, email 以及 password。

HTML 4.01 与 HTML 5 之间的差异

placeholder 属性是 HTML5 中的新属性。

语法

<input placeholder="text">

属性值

描述
text 规定用于验证输入字段的模式。

HTML 5 <input> 标签

但是在firefox,IE下都能实这个效果,chrome和safari点击后不会消失,得输入东西之后才会消失。

在CSS中加入以下代码即可实现:

input:focus::-webkit-input-placeholder,textarea:focus::-webkit-input-placeholder
{
color: transparent;
}

原理为:将placeholder提供的提示信息文字的颜色设置为"transparent"(透明)。

HTML 5 <input> placeholder 属性

标签:

原文地址:http://www.cnblogs.com/Candies/p/4174379.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!