html - 用图像替换默认提交按钮不起作用

Question

我正在尝试使用 CSS 中的背景图像将我的提交按钮替换为图像，然而，这是给它一个背景图像，但默认提交按钮仍然在前景中，上面有文本。我也试过在我的 HTML 中添加图像，但它不显示图像，我猜是因为类型仍然是提交。有没有办法在不将其更改为 type=image 的情况下执行此操作？正如我所见，它确实适用于其他示例，但由于某种原因它在我的示例中不起作用:/

这是我的代码: http://jsfiddle.net/e94yh/

HTML

 <input type="submit" id="submit" value="Submit" src="../assets/images/submit.png"/>
</form>

CSS

 input[type=submit]{
cursor: pointer;
 }

 #submit {
width:100px;
height:auto;
 }

Answer 1

使用 background:url(''); 和 color:transparent;

CSS

input[type=submit]{
background:url('../assets/images/submit.png');
cursor: pointer;

颜色:透明；

代替 src=""

FIDDLE DEMO