当选中对话框后，提示文字变浅色,输入后消失.这个现在通行的做法是在Input标签后面增加一个Label。使用JS控制。
HTML5出现后，我们有一个更好的方法。
代码如下:
大佬教程收集整理的这篇文章主要介绍了html5配合css3实现带提示文字的输入框(摆脱js)，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <Meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>placeholder Demo</title> </head> <body> <style> input[type=text],input[type=password] { border-color: #bbb; height: 38px; font-size: 14px; border-radius: 2px; outline: 0; border: #ccc 1px solid; padding: 0 10px; width: 250px; -webkit-transition: Box-shadow .5s; margin-bottom: 15px; } input[type=text]:hover,input[type=text]:focus,input[type=password]:hover,input[type=password]:focus { border: 1px solid #56b4ef; Box-shadow: inset 0 1px 3px rgba(0,.05),0 0 8px rgba(82,168,236,.6); -webkit-transition: Box-shadow .5s; } input::-webkit-input-placeholder { color: #999; -webkit-transition: color .5s; } input:focus::-webkit-input-placeholder,input:hover::-webkit-input-placeholder { color: #c2c2c2; -webkit-transition: color .5s; } </style> <input type="text" placeholder="用户名或邮件地址" name="username" /> <input type="password" placeholder="密码" name="password" /> </body> </html>
以上是大佬教程为你收集整理的html5配合css3实现带提示文字的输入框(摆脱js)全部内容，希望文章能够帮你解决html5配合css3实现带提示文字的输入框(摆脱js)所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。