为HTML5 placeholder占位文字添加css样式

2017-07-03  本文已影响0人  一个小小程序猿

placerholder属性是HTML5中的新属性。


定义和用法:

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

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

 语法:

      <input  placeholder="text ">

 属性值:

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

       简单说,就是提示用户输入什么类型的信息。

注释:

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

placeholder默认显示为灰色

 我们可以通过css控制placeholder文字的样式。

以下为各个浏览器厂商为其提供的伪类控制属性:


::-webkit-input-placeholder{}/*使用webkit内核的浏览器*/

::-moz-placeholder{}/*FIrefox版本19+*/

:-moz-placeholder{}/*Firefox版本4-18*/

::-ms-input-placeholder{}/*IE浏览器*/


具体实例实现:

主要代码:



上一篇 下一篇

猜你喜欢

热点阅读