Buttons are the most commonly used controls on webpages. several methods have been tested over the past two days to design better-looking buttons:
1. Use JavaScript to exchange images. First, create images on the webpage, convert the images to server-side controls, and add event processing for the controls. However, it is a pity that the system does not respond during running. I guess it is related to the picture being exchanged.
2. When a button is handed over to a page, it is actually an input, so it is OK to write a style with CSS. As a result, it is found that, although the button ID in the client page is the original ID, the CSS written does not work. Originally,. NET added a style for the button, and the priority is obviously higher than the custom one. It seems that you have to block the style automatically added by the system.
3. Try Hyperlink and write CSS for it. There is no problem in the result image exchange, but the button event cannot be added.
4. At last, use linkbutton to write CSS with the linkbutton ID, and then remove the text. Result: both the effect of switching images and event processing are considered.
There may be better solutions, but this is already relatively simple. You only need to change the CSS to get everything done. CSS is simple: # 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);
}