Question

CSS按钮背景鼠标放上去变换背景的代码怎么设置

我想把按钮的背景变换。就是鼠标放在按钮上。按钮的背景换图片！！

Answer 1

简单写一个，或许有助于理解：<input value="按钮" type="button" style="background-color: Transparent;" onmouseover="this.style.backgroundImage='url(1.jpg)'" onmouseout="this.style.backgroundImage='url(2.jpg)'"/> 关键的地方有三个：一是：style="background-color: Transparent;"这里是设置按钮默认风格的，background-color: Transparent，意思是把背景颜色设为透明，这是一定要的，否则在不同的浏览器中，把图片设为按钮背景有可能是显示不出来的。这里还可以定义的风格，比如，宽度：width:120px; 高度：height:30px; 字体颜色：color:#ffffff; 背景图片：background-image:url(图片); 等之间用;号隔开。二是：onmouseover="this.style.backgroundImage='url(1.jpg)'"表示当鼠标移入时，背景图片设置为1.jpg这张图，可以在url()的括号中指定具体图片地址和名称。三是： onmouseout="this.style.backgroundImage='url(2.jpg)'" 表示当鼠标移出时，背景图片设置为2.jpg，这也是在url()中指定具体的图片。这只是一种简单的写法，更多的应该多了解js和css。

Answer 2

假设你的按钮的class是btn，两个背景图片分别是bg1.jpg和bg2.jpg，那么可以这样来做
css部分：
.btn {background:url(bg1.jpg);}
.btn:hover {background:url(bg2.jpg);}

html部分就很简单了，给input加个样式就行
<input class="btn" type="submit" value="我是按钮" />

使用这个样式时别忘了先把input的默认样式，那些padding、margin、border什么的都清零，然后再定义一下宽高，这样出来的视觉效果会好些。

Answer 3

标签名：hover｛内容｝