zoukankan      html  css  js  c++  java
  • 用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);
    }
  • 相关阅读:
    Python中*和**的区别
    Python中str、list、numpy分片操作
    Python中bisect的使用方法
    Python中__str__和__repr__的区别
    Python中函数参数类型和参数绑定
    C++中explicit
    C++中const
    自动识别 URL
    .net中activex的替代技术:winform control(一)
    vs2005包加载有误的解决方法
  • 原文地址:https://www.cnblogs.com/jetz/p/588139.html
Copyright © 2011-2022 走看看