用html如何实现点击按钮变换按钮的样式，就是点击一个按钮按钮的图形样式就变了
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了用html如何实现点击按钮变换按钮的样式，就是点击一个按钮按钮的图形样式就变了相关的知识，希望对你有一定的参考价值。
参考如下：<!DOCTYPE html >
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>更换单选按钮显示样式</title>
<style>
input[type=\'radio\'].radio opacity:0; display:inline-block; height:20px;
label.radio background:url(imgs/radio_check.png) no-repeat; height:20px; padding-left:25px;
input[type=\'radio\'].radio:checked + .radio background:url(imgs/radio_checked.png) no-repeat;
</style>
</head>
<body>
<input type="radio" name="gender" id="x" value="X"><label for="x">我要保密</label><br>
<input type="radio" name="gender" id="y" value="M"><label for="y">我是帅哥</label><br>
<input type="radio" name="gender" id="z" value="F"><label for="z">我是美女</label><br>
<input type="radio" name="sex" id="a" value="X" class="radio"><label for="a" class="radio">我要保密</label><br>
<input type="radio" name="sex" id="b" value="M" class="radio"><label for="b" class="radio" >我是帅哥</label><br>
<input type="radio" name="sex" id="c" value="F" class="radio"><label for="c" class="radio" >我是美女</label><br>
</body>
</html>
首先
<div class="tubh">
<a href="#"></a>
</div>
css样式：
.tubh a
display:block;
width:100px;/*根据图片的大小定义宽度*/
height:100px;/*根据图片的大小定义高度*/
float:left;
background:url(../images/img.jpg) no-repeat; /*你开始的图片*/
.tubh a：hover
display:block;
width:100px;/*根据图片的大小定义宽度*/
height:100px;/*根据图片的大小定义高度*/
float:left;
background:url(../images/img.jpg) no-repeat; /*你要变换的图片*/
这样就可以变换了。记得采纳！本回答被提问者采纳 参考技术C 用鼠标点击事件可以搞定
onClick 鼠标点击事件，多用在某个对象控制的范围内的鼠标点击
onDblClick 鼠标双击事件
onMouseDown 鼠标上的按钮被按下了
onMouseUp 鼠标按下后，松开时激发的事件
onMouseOver 当鼠标移动到某对象范围的上方时触发的事件
onMouseMove 鼠标移动时触发的事件
onMouseOut 当鼠标离开某对象范围时触发的事件
提问：怎样实现点击一个按钮弹出下拉列表
用css把按钮弄成下列表的样式，用一个事件，按下时，调用一个显示div的样式，div里面，是一个真正的下拉框。。。div弹出时设置位置时，盖住按钮即可。 参考技术A 参考代码如下：设置PopupMenu属性：AutoPopup为false，TrackButton为tbLeftButton
自定义方法
void TfrmBrand::BtnPopup(TBitBtn *BitBtnOne,TPopupMenu *PopupMenuOne)
TPoint t1,t2;
t1.x=0;
t1.y=BitBtnOne->Height;
t2=BitBtnOne->ClientToScreen(t1);
PopupMenuOne->Popup(t2.x,t2.y);
点击bitEdit按钮弹出菜单
void __fastcall TfrmBrand::bitEditClick(TObject *Sender)
BtnPopup(bitEdit,PopupMenu1);
以上是关于用html如何实现点击按钮变换按钮的样式，就是点击一个按钮按钮的图形样式就变了的主要内容，如果未能解决你的问题，请参考以下文章