设置input中的placeholder

<input type="text" placeholder="输入邮箱账号">

如果希望点击input(type=text)元素之后,placeholder消失有2种方法:

1.js方法
使用focusblur事件

<input type="text" placeholder="输入邮箱账号" onfocus=" this.placeholder='' " onblur=" this.placeholder='输入邮箱账号' ">

2.使用css3伪类

通过 ::placeholder:focus 伪类来处理,注意添加前缀

input:focus::-webkit-input-placeholder { color: transparent }
input:focus:-moz-placeholder { color: transparent }  // FF4-18
input:focus:-moz-placeholder { color: transparent }  // FF18+
input:focus:-ms-input-placeholder { color: transparent }  // IE10+
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 转载请声明 原文链接 关注公众号获取更多资讯 这篇文章主要总结H5的一些新增的功能以及一些基础归纳,这里只是一个提...
    前端进阶之旅阅读 12,955评论 22 225
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,369评论 19 139
  • 本文转载自:众成翻译译者:为之漫笔链接:http://www.zcfy.cc/article/239原文:http...
    极乐君阅读 12,101评论 1 62
  • 雷,炸响, 电,飞闪, 云压天低, 雷公龙王何所怒, 这般疯狂? 几番雷电, 几番雨, 淫威施尽自消散, 笑你不自...
    北塔雪松阅读 3,984评论 19 72
  • 忙碌之中,一周已经过去了,现在写总结的时候已经是周一了,时间比我们想象得要流逝得快得多,现在简要总结一下一周来的写...
    amazing2017阅读 1,813评论 0 1