用html如何实现点击按钮变换按钮的样式，就是点击一个按钮按钮的图形样式就变了
4个回答
展开全部
参考如下：
<!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>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
用javascript实现。在这个按钮里追加onclick事件，每次修改按钮的图片就可以了。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
可以啊 就用css样式控制就行了。
首先
<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; /*你要变换的图片*/
}
这样就可以变换了。记得采纳！
首先
<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; /*你要变换的图片*/
}
这样就可以变换了。记得采纳！
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
用鼠标点击事件可以搞定
onClick 鼠标点击事件，多用在某个对象控制的范围内的鼠标点击
onDblClick 鼠标双击事件
onMouseDown 鼠标上的按钮被按下了
onMouseUp 鼠标按下后，松开时激发的事件
onMouseOver 当鼠标移动到某对象范围的上方时触发的事件
onMouseMove 鼠标移动时触发的事件
onMouseOut 当鼠标离开某对象范围时触发的事件
onClick 鼠标点击事件，多用在某个对象控制的范围内的鼠标点击
onDblClick 鼠标双击事件
onMouseDown 鼠标上的按钮被按下了
onMouseUp 鼠标按下后，松开时激发的事件
onMouseOver 当鼠标移动到某对象范围的上方时触发的事件
onMouseMove 鼠标移动时触发的事件
onMouseOut 当鼠标离开某对象范围时触发的事件
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（2）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
