asp.netAjax--TextBoxWateramrk控件使用

简介
    TextBoxWatermark控件是一个用于TextBox的水印控件,就是在文本框输入文字之前,文本框中有一些提示性的文字,并可以自定义css控制它的样式,实际用处我感觉不是很大,但给用户带来了操作上的方便,也有很好的视觉效果.

    重要属性
    TargetControlID:要应用水印效果的文本框的ID
    WatermarkText:水印效果的提示文本
    WatermarkCssClass:水印效果所采用的CSS样式

    示例
1 打开vs2005创建一个AjaxControlToolKit网站,命名为oec2003_TextBoxWatermark
2 打开默认的Default.aspx页,切换到设计视图
3 添加两个文本框和两个TextBoxWatermark控件,如下图

4 切换到代码视图,设置TextBoxWatermark控件的属性,代码如下
1   < ajaxToolkit:TextBoxWatermarkExtender  ID ="TextBoxWatermarkExtender1"  runat ="server"  TargetControlID ="TextBox2"  WatermarkText ="请输入用户名"  WatermarkCssClass ="water1" >
2          </ ajaxToolkit:TextBoxWatermarkExtender >
3     
4      </ div >
5          < ajaxToolkit:TextBoxWatermarkExtender  ID ="TextBoxWatermarkExtender2"  runat ="server"  WatermarkText ="请输入密码"  TargetControlID ="TextBox1"  WatermarkCssClass ="water2" >
6          </ ajaxToolkit:TextBoxWatermarkExtender >

5 添加css 如下
 1 <style type="text/css">
 2         .water1
 3          {
 4            height:20px;
 5            width:150px;
 6            padding:2px 0 0 2px;
 7            border:1px solid #BEBEBE;
 8            background-color:#F0F8FF;
 9            color:red;
10        }

11         
12         .water2
13          {
14            height:20px;
15            width:150px;
16            border:1px none #ffffcc;
17            background-color:#ccccff;
18            color:green;
19        }

20     </style>

这儿只是简单地写了点css ,大家也可以通过css写出很漂亮的水印
保存设计,运行程序就能看到效果,当鼠标点击文本框时水印消失,文本框中出现光标,鼠标离开后,水印再次出现.  
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值