为什么在form表单里input type是图片时起到提交的作用

Question

重置也可以用图片代替么，具体怎么做？

Answer 1

用css可以定义所有input的背景，而对于 type="image" 文档已经规定了它的作用就是定义图像形式的提交按钮：

建议当你需要定义input[type="submit"]背景图像时，不要用这样的形式，而采用css的方式。因为它是一个图像请求，不支持sprite的background-position定位。原因是从交互角度来说，按钮至少要有两个状态，即 normal,hover(还有active)，并且一般我们在切图时会将网站所有小图标和按钮做成sprite图像以减少http请求。为一个按钮(可能更多)多一个请求不值得。

也有人使用JavaScript来将一个image或者type="image"的按钮的点击行为设成reset，强烈不建议这种方式。

当然上上之举是使用css3，如segmentfault的按钮:)

简单示例：

<input type="reset" class="reset-btn"/>

.reset-btn {
 border:none;
 background:url(btn.png) 0 0 no-repeat;
 width:60px;  
 height:40; 
 cursor:hand; 
}

.reset-btn:hover {
/*hover ie6 不支持*/
}