html5中placeholder的使用

简介:

定义和用法

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

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

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

看代码

1
2
3
4
5
6
7
8
9
<!DOCTYPE HTML>
< html >
< body >
< form  action = "#"  method = "get" >
< input  type = "search"  name = "user_search"  placeholder = "输入内容后我会消失"  />
< input  type = "submit"  />
</ form >
</ body >
</ html >

效果图

082333729.png

输入字体后效果图

082410938.png

当然了,在使用的时候需要引入html5.js这个文件


本文转自sucre03 51CTO博客,原文链接:http://blog.51cto.com/sucre/1320253,如需转载请自行联系原作者

相关文章
|
移动开发 HTML5
修改HTML5 input placeholder 颜色及修改失效的解决办法
修改HTML5 input placeholder 颜色及修改失效的解决办法
|
Web App开发 移动开发 JavaScript
|
Web App开发 移动开发 JavaScript
IE8 不支持html5 placeholder的解决方案
  IE8不支持html5 placeholder的解决方法。 /** * jQuery EnPlaceholder plug * version 1.0 2014.
1105 0
|
移动开发 JavaScript HTML5
HTML5 placeholder(空白提示) 属性
原文地址:HTML5′s placeholder Attribute  演示地址: placeholder演示  原文日期: 2010年08月09日 翻译日期: 2013年8月6日 浏览器引入了许多的HTML5 特性: 有些是基于HTML的,有些是JavaScript APIs形式的,但都很有用。
895 0
|
移动开发 JavaScript HTML5
HTML5实践 -- 实现跨浏览器HTML5文字占位符 - placeholder
  转载请注明原创地址:http://www.cnblogs.com/softlover/archive/2012/11/20/2779878.html      html5为web的form表单增强了一个功能,他就是input的占位符--placeholder。
933 0
|
8天前
|
XML 前端开发 JavaScript
Html:CSS介绍
Html:CSS介绍
24 1
|
8天前
|
前端开发
Html:CSS的书写位置
Html:CSS的书写位置
18 0
|
3天前
|
前端开发 JavaScript 搜索推荐
打造个人博客网站:从零开始的HTML和CSS之旅
【9月更文挑战第32天】在这个数字化的时代,拥有一个个人博客不仅是展示自我的平台,也是技术交流的桥梁。本文将引导初学者理解并实现一个简单的个人博客网站的搭建,涵盖HTML的基础结构、CSS样式的美化技巧以及如何将两者结合来制作一个完整的网页。通过这篇文章,你将学会如何从零开始构建自己的网络空间,并在互联网世界留下你的足迹。