• 用CSS制作可交换带事件处理的图片按钮


          按钮是网页最常用的控件了,怎样设计一个更好看的按钮,这两天试验了几种方法:
          1、用Javascript交换图片的方式先在网页中制作图片,然后把图片转换为服务器端控件,为该控件添加事件处理。不过,很遗憾,运行时不响应,我估计跟图片被交换了有关。
          2、按钮在交到页面时,其实就是一个input,那么用css写一个样式就ok了。结果,发现客户端的页面中,按钮的ID虽然是原来的ID,但是写的CSS并没有起作用。原来,.net自己为按钮加了一个style,优先级显然比自定义的要高了。看来得想办法把系统自动加的style屏蔽掉才行。
          3、再试HyperLink,为它写css,结果图片交换没有问题,可是又无法把按钮事件加上。
          4、最后,用LinkButton,仍然以LinkButton的ID写css,然后把文字去掉。结果,交换图片效果和事件处理都能兼顾。
          也许还有更好的办法吧,不过这样已经比较简单了。只要改css就基本搞定一切了。CSS很简单:
    #ok{
        position
    :relative;
        border
    :0px solid #000000;
        height
    :42px;
        width
    :110px;
        top
    :85px;
        left
    :60px;
        position
    :relative;

    }

    #OkBtn
    {
        display
    :block;
        width
    :100%;
        height
    :100%;
        background-image
    :url(../images/login_ok_1.jpg);
    }

    #OkBtn:hover
    {
        background-image
    :url(../images/login_ok_2.jpg);
    }
  • 相关阅读:
    C# ViewState
    ASP.NET C#中Application Session 的用法
    JS取 Input 控件值方法
    JS通过HTML标签自身属性获取属性值
    SQLServer 数据库操作
    查看和修改 Windows 实例远程桌面默认端口
    只能输入数字0-9 正则表达式,兼容Google Firefox IE浏览器
    C# 类初始化顺序
    window系统 任务计划程序
    微信公众号开发--消息接收与回复
  • 原文地址:https://www.cnblogs.com/jetz/p/588139.html
Copyright © 2020-2023  润新知