A-A+

ecshop实现输入框默认值为灰色,点击输入值为黑色

2015年07月05日 PHP开源系统 暂无评论 阅读 13 views 次

我们经常会看到网页的文本输入框,在默认的时候是灰色状态,当鼠标点击上去输入的值却为黑色,这样的提示很好,比如在没有输入的时候,我们可以以灰色以提示消费者这是要输入什么内容,不要太明显,在输入进去的时候则很明显,这样的体验很好,是目前大多数站点制作的方式了,比如用在注册或者登陆的文本框中,下面夏日博客就以登陆为例来实现这样的效果,其实也不是很难,只是在 input 文本框里面应用了 CSS 样式和 js 点击效果而已,看如下代码:

<input name="username" type="text" value="手机/邮箱/用户名" class="inputBg" style="width:198px; height:28px; color:#ccc;" onfocus="if(value=='手机/邮箱/用户名'){this.style.color='#000';value=''}" onblur="if(value==''){this.style.color='#ccc;value='手机/邮箱/用户名''}"

好了,这里就没有单独的设置CSS样式了,在 ecshop 需要的地方,进行整理一下就这样调用吧。

标签:

给我留言